t.createDocumentFragment is not a function - parseHTML - JQuery 3.3.1 - javascript

I recently upgraded from JQuery 1.9 to 3.3.1 and am getting an error in some of my old code relating to the $.parseHTML() function.
The docs state some changes in the behavior of this function but shouldn't effect my usage.
I'm trying to ajax GET a view, parse it, append it to modal content, and then show the modal.
success: function(editView){
//GETTING ERROR AT THE BELOW LINE
var html = $.parseHTML(editView, $('.modal-edit-content'), true);
//load editView into the modal content tag
$('.modal-edit-content').html('');
$('.modal-edit-content').append(html);
}...
This is the error:
jquery-3.3.1.min.js:2 Uncaught TypeError: t.createDocumentFragment is not a function
The code was working correctly in JQuery 1.9. Any ideas how to fix this?

Related

Something causing interference

So I've got the following code that works in jsfiddle, but not on the actual website, which leads me to believe that the only way I'm going to get it working is for someone with more experience than I to look through the source and see what's interfering.
<script>
$(document).ready(function(){
var $elements = $('body').children('div[class^=class]').on('click', function () {
$elements.removeClass('classname')
.not('.' + this.className)
.addClass('classname');
});
});
</script>
Website: http://sinfulgurotesque.tumblr.com/recs
Edit: I've removed a section of code from the website that had nothing to do with this part. (It was the deprecated code, and it didn't offer much in terms of functionality anyways.)
You're using jQuery 1.10.1 in your page, and the error you're getting:
jquery.style-my-tooltips.js:26 Uncaught TypeError: undefined is not a
function
is referring to the .live() function used by the plugin which was removed in jQuery 1.9
$(".smt-current-element").live("mouseout mousedown click",function(){
It looks like you're calling depracated JS functions. I got:
TypeError: $(...).live is not a function
when opening your page. Try changing .live() to .on()
Like so
$("body").on("mouseout mousedown click", ".smt-current-element", function(){...

Error on thr page jQuery(...).on is not a function

I am creating my first yii framework project. I am using cgridview in my project. When I load the page an error is showing in the console. The error is coming from a Javascript code generated by cgridview.
error is
TypeError: jQuery(...).on is not a function
jQuery(document).on('click','#items-grid a.delete',function(){
My javascript is
/*<![CDATA[*/
jQuery(function($) {
jQuery(document).on('click','#items-grid a.delete',function(){
confirmDelete(this);
return false;
});
jQuery('#items-grid').yiiGridView({'ajaxUpdate':['menuitems- grid'],'ajaxVar':'ajax','pagerClass':'pager','loadingClass':'grid-view-loading','filterClass':'filters','tableClass':'items','selectableRows':1,'enableHistory':false,'updateSelector':'{page}, {sort}','filterSelector':'{filter}','pageVar':'items_page'});
});
/*]]>*/
What Kind of issue this is. I have included jquery.js latest vertion in my header. I tried older version also but this error is same. How should I fix this error?
You may need to disable Yii's build-in JQuery and use your own version of JQuery. To disable Yii's built-in JQuery put the following lines into your view and load your own JQuery with avoiding conflicts:
Yii::app()->clientScript->scriptMap=array(
'jquery.js'=>false,
'jquery.ui.js' => false,
);

Jquery mobile loading does not work

i want to show loading gif until data loaded with jquery mobile
but it does not work ..in console it give that error
Uncaught TypeError: Object #<Object> has no method 'loading'
this is my page :enter link description here
and in this page that i added code
$.mobile.loading( 'show');
and this not work:enter link description here
my code
<script type="text/javascript">
$('#details').live('pageinit', function (event) {
$.mobile.showPageLoadingMsg();
$("#listeu").empty();
$.getJSON('http://teknonova.com/Map/Home/getir3/1', function (data) {
The error sounds like either the jquery mobile library wasn't loaded properly (maybe loaded before jquery and failed init) or the version of jquery mobile doesn't support that method.
I'd use the dev console to see what the $.mobile object is for more clues

while closing jquery thickbox jquery image slider is giving error

I am using Thickbox 3.1(by cody lindley) in my asp.net application. While closing thickbox I am getting jquery error from file "jQuery UI Tabs 1.7.2" file which is for showing image slider on the same parent page,
Error is :-
Microsoft JScript runtime error: Unable to get value of the property 'add': object is null or undefined.
and while debugging its coming from the below code,
a(window).bind("unload", function ()
{
p.lis.add(p.anchors).unbind(".tabs");
p.lis = p.anchors = p.panels = null
})
as "p.anchors" is coming null, but how to solve this issue.
Just got the solution guys, great effort on by "maxchirkov" on weblink http://wordpress.org/support/topic/wp-32-thickbox-jquery-ui-tabs-conflict.
The issue was from "unload" event conflict in the thickbox and Jquery-UI-tabs scripts.
In the thickbox.compressed.js, I hv changed:-
// $("#TB_window").fadeOut("fast", function () { $('#TB_window,#TB_overlay,#TB_HideSelect').trigger("unload").unbind().remove(); });
above code to :-
$("#TB_window").fadeOut("fast", function () { $('#TB_window,#TB_overlay,#TB_HideSelect').unload("#TB_ajaxContent").unbind().remove(); });
and its working now.

jquery autocomplete this.source is not a function error

I've implemented autocomplete on an input field, but the box does not show up and firebug returns "this.source is not a function". I've used autocomplete on other fields of the same page without any problems. (two textarea's).
I'm using the following code to debug, same effect if I run from script file or Firebug command line.
var fakedata = ['test1','test2','test3','test4','ietsanders'];
$("#omschrijving").autocomplete(fakedata);
running jquery 1.4.2 and jquery ui 1.8.2, both minified versions.
Does anyone have an idea how autocomplete works fine on the textareas but causes this malfunctioning on inputs?
Error & Stack trace:
this.source is not a function
http://facturatie.autodealers.nl/dev/resources/js/jquery-ui-1.8.2.custom.min.js
Line 570
close(Object { name="a"})jquery....min.js (regel 570)
close(Object { name="a"}, Object { name="c"})jquery....min.js (regel 570)
response()
Answer is that the first parameter of the autocomplete should be an object containing the "source" property. This works
var fakedata = ['test1','test2','test3','test4','ietsanders'];
$("#omschrijving").autocomplete({source:fakedata});
If you were trying to use autocomplete from http://www.devbridge.com/projects/autocomplete/jquery/#demo, it now collides with the autocomplete method in jQuery UI. I had the same problem and later noticed that I could just use the jQuery UI implementation.
(NOTE: It appears that this page's documentation is wrong: http://docs.jquery.com/Plugins/Autocomplete#Setup)
If you use it with jQuery UI library it also has plugin named autocomplete. In this case you can use plugin alias devbridgeAutocomplete:
$('.autocomplete').devbridgeAutocomplete({ ... });
This solve the problem with jQuery UI collision
As Shelton stated, the version from devbridge.com (1.1.3) collides with jQuery UI (1.8.4). Got it working by making sure the devbridge version loads after jQuery UI's version.
Had similar problem for tagedit/autocomplete. It seems you also want to disable the autocomplete. Setting the source to false avoids these errors.
Solution:
options.autocompleteOptions.source = false;
Search at the end of jquery.autocomplete.js the following section:
Create chainable jQuery plugin:
$.fn.devbridgeAutocomplete = function (options, args) {....
This devbridgeAutocomplete is an alternative plugin to access to the same functionality using this lines:
if (!$.fn.autocomplete) {
$.fn.autocomplete = $.fn.devbridgeAutocomplete;
}
So.. you can use devbridgeAutocomplete instead of autocomplete or any name by changing this $.fn.devbridgeAutocomplete
in my case I had a second import of jquery which I didn't realize.
Something like:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.devbridge-autocomplete/1.2.27/jquery.autocomplete.min.js"></script>
// More code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>
So be sure to import the autocomplete script after you initialized jquery.

Categories