I’m trying to use this jQuery datepicker to this page. If you scroll down the page to the ‘plus’ sign and click it, you will see a ‘Start Date’ and an ‘End Date’ textbox. Clicking inside them, a calendar pop up is suppose to display. It doesn’t.
I have both the jquery and jquery UI loading. Chrome Developer Tools does not show any conflicts. The class I’m using on these textboxes is ‘datepicks’.
The problem is that those date fields are dynamically added to the page, after you’ve initialised the datepicker component. What you need to do is something like this:
This attaches a handler to the body tag that listens for any time an element with the class ‘datepicks’ receives the focus. When it does, it initialises a datepicker widget on that element.
If you look where you’ve put that in the page, it’s coming before the body tag… so jQuery tries to attach the handler and fails (silently) because there’s no body element. Move your script block just before the closing </body> tag.
Looks like you have code for a different datepicker included in the page. Try changing this line jQuery(this).datepicker(); to jQuery(this).gdatetimepicker();