UPDATE
I have reverted back to Jquery 1.3.2 and everything is working, not sure what the problem is/was as I have not changed anything else apart of the jquery and ui library versions.
UPDATE END
I having an issue with the JQuery UI datepicker. The datepicker is being attached to a class and that part is working but the datepicker is not being displayed.
Here is the datepicker code I am using and the inline style that is being generated when I click in the input box that has the class ".datepicker".
$('.datepicker').datepicker({dateFormat:'dd/mm/yy'});
display:none;
left:418px;
position:absolute;
top:296px;
z-index:1;
If I change the display:none to display:block the datepicker works fine except it dosen't close when I select a date.
Jquery libraries in use:
- jQuery JavaScript Library v1.4.2
- jQuery UI 1.8 jQuery UI Widget 1.8
- jQuery UI Mouse 1.8 jQuery UI
- Position 1.8 jQuery UI Draggable 1.8
- jQuery UI Droppable 1.8 jQuery UI
- Datepicker 1.8
This may be helpful to someone. If you copied and pasted your form data (which has the datepicker input box, ensure you do not inadvertently copy the class="hasDatepicker"
This means your input box should look like this:
NOT
I made that mistake inadvertently. Removing the class and allowing the jQuery UI call appeared to fix it.
Hope that helps someone!
I've had a similar issue with 1.7.2 versions of jQuery and jQuery UI. The popup wasn't showing up and none of the applicable suggestions above helped. What helped in my case was taking out the class="hasDatepicker" which (as the accepted answer here notes: jQuery UI datepicker will not display - full code included) is used by jquery-ui to indicate that a datepicker has already been added to the text field. Wish I found that answer sooner.
If you are using the scripts of metro UI css (excellent free metro UI set from http://metroui.org.ua/) , that can clash too. In my case, this was the problem recently.
So, removed the scripts reference of metro UI (as I was not using its components), datepicker is showing.
But you cant get metro look for datepicker of jQuery-ui
But in most cases, as others mentioned, its clash with duplicate versions of jQuery-UI javascripts.
it's the css file in the new one doesn't work. Try to include the old 1.7.* css file on your header too, and try again.
Also, did you try to do a .datepicker( "show" ) right after it constructed?
I was having the same problem, and I found that in my case the cause was the datepicker div for some reason is retaining the class .ui-helper-hidden-accessible, which has the following CSS:
I'm using the google CDN hosted versions of jquery, so I couldn't modify the code or the CSS. I had also tried changing the z-index without any success. The solution that worked for me was to set the clip property for the datepicker back to its default value, auto:
Since this specifically targets the datepicker div, there's less of a chance of unintended side effects on other widgets than changing the ui-helper-hidden-accessible class as a whole.
Here is the full code, it's working from my side: just test.