Is it possible to instantiate all datetimepicker's with one javascript call? - javascript

I have PHP generating a random amount of bootstrap-datetimepicker widgets, and I'm trying to instantiate them with one jQuery function, rather than one for each.
They all have the class .datepicker, but
$(function () {
$('.datepicker').datetimepicker();
});
does not work.
Any ideas?
EDIT:
I just tried
$(function () {
$('.datepicker').each(function(){
$(this).datetimepicker();
});
});
however, I still get the error Uncaught TypeError: Cannot read property 'dateOptions' of null.
EDIT: Fixed.
Hi,
I am working on a legacy codebase, and was using the wrong jQuery to instantiate. Everything works with the latest jQuery.

Related

Prototype and jQuery conflict with $.when.apply

I have tried multiple combination of usage of code to make the Prototype and jQuery to work, but no luck yet.
Here is what I have currently.
index.html:
<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.2.0/prototype.js"></script>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="MAIN_JS_FILE.js"></script>`
main_js_file.js:
jQuery(document).ready(function() {
var jsq = [];
jsq.push(AJAX_CALL_FOR_FETCHING_JS_FILE_1);
jsq.push(AJAX_CALL_FOR_FETCHING_JS_FILE_2);
jsq.push(AJAX_CALL_FOR_FETCHING_JS_FILE_3);
var deferredjs = jQuery.when.apply(jQuery, jsq);
deferredjs.done(function() {
//Various variable initialization
//Various function definition.
}
});
Now when page is loaded (page loads properly), chrome console shows an error message:
Uncaught TypeError: undefined is not a function.
When clicked on the error file link, it points to element.dispatchEvent(event); in the prototype.js file, line no 7066.
Any help is appreciated.
Thanks.
Edit: I have changed the MAIN_JS_FILE.js file to use only jQuery instead of $
So now there is not a single javascript code that uses $ and still the undefined error is displayed.
If I now use jQuery.noConflict(); before .ready() function, then the $.when.apply code does not even execute.
As #steven iseki mentioned in comment you, can use jQuery.noConflict. You can read on their website that:
Many JavaScript libraries use $ as a function or variable name, just as jQuery does. In jQuery's case, $ is just an alias for jQuery, so all functionality is available without using $.
And it's indeed a case with Prototype also using $ sign.
Also, remember to use jQuery instead of $ sign in your jQuery code, e.g.:
jQuery(selector).on('click', function(){...});
I don't think there's jQuery Conflict error here. Try changing your code from main.js. Try alternate method to get your task done here. I analyzed your code but prototype.js has a way of hiding real thing.

Uncaught TypeError: undefined is not a function - jQuery

I have problem with website slide. after clicking on inspect element in chrome i get massage
"Uncaught TypeError: undefined is not a function" in file custom.js
here is file code
jQuery(document).ready(function() {
jQuery('#slider').nivoSlider({pauseTime: 4500}); });
}
here is website address http://myisraeltoday.com using WordPress
Theme: http://wordpress.org/themes/effect
Help needed
That means that you're calling something as a function (or method), when in fact it doesn't exist. You're calling three functions:
jQuery
jQuery(document).ready
jQuery('#slider').nivoSlider
The third of these is most likely the problem.
try changing your code to this :
$(document).ready(function() {
$('#slider').nivoSlider({'pauseTime': 4500});
});
PS : Note the }); at the end not just the $

Possible causes of Cannot read property constructor of undefined

I want to iterate over all the forms present in a div. So I am using the following code for this
$('#divid form').each(function (index, formDetails) {
if (formDetails) {
console.log($(formDetails).attr('id'));
}
});
This is working fine in Mozilla with no issues but when I run this code in Chrome sometimes it throws the following error.
This error is coming
Uncaught TypeError: Cannot read property 'Constructor' of undefined
I am using Version 33.0.1750.117 m of Chrome.
Why this error is coming I am not able to understand?
Sounds like you don't have jQuery included before your try and load your functions.
Wrap your javascript code inside the below function:
$(document).ready(function() {
alert('loaded');
}
Also check if the initial is $ or jQuery

How do I hide or show DataTables.net colums?

Based on the API docs at DataTables site, I created the following javascript function to show only one specific table at a time:
function ShowColumn(columnNum) {
var table = $('#MemberStatisticGrid').dataTable();
$('#SelectedMetricList option').each(function (index) {
table.fnSettings().fnSetColumnVis(index, false);
});
table.fnSettings().fnSetColumnVis(columnNum, true);
}
However, this fails with the error Uncaught TypeError: Object #<1> has no method 'fnSetColumnVis'
I don't get why I am getting this, as according to the API docs this is how you call it. Furthermore, when I view the available methods and properties on the fnSettings() via the chrome console, I don't see a fnSetColumVis method.
What am I missing?
Have you tried just using table.fnSetColumnVis? That works for me.

Error with bgStretcher - jQuery conflict?

I'm trying to implement the bgStretcher jQuery plugin, and seem to get some conflicts. I'm still relatively new to jQuery, and conflicts still puzzle me.
My current site is here - http://65.60.53.10/~purerun/
The bgStretcher is giving the following error - Uncaught TypeError: Cannot call method 'split' of undefined - but it's within the plugin code.
My current implementation is as follows:
jQuery(document).ready(function($){
// other code
jQuery('body').bgStretcher({images: ['http://65.60.53.10/~purerun/wp-content/gallery/backgrounds/26.jpg','http://65.60.53.10/~purerun/wp-content/gallery/backgrounds/img_4793.jpg'], nextSlideDelay: '10000'});
}
Any help would be appreciated....
The nextSlideDelay value you should be a number not a string; try removing the quotes around it like this:
jQuery(document).ready(function($){
// other code
jQuery('body').bgStretcher({images: ['http://65.60.53.10/~purerun/wp-content/gallery/backgrounds/26.jpg','http://65.60.53.10/~purerun/wp-content/gallery/backgrounds/img_4793.jpg'], nextSlideDelay: 10000});
}
I hope this helps!

Categories

Resources