Since I've missed the background on this, could you provide a link to a page demonstrating the problem?

In Bugzilla I see a lot of bugs targeting Firefox 20 with new functionality for <input type="date">. I wonder whether something got into Firefox 19 accidentally/prematurely?

• 769352 – DOM/content implementation for <input type=date>
• 769355 – Implement <input type=date> max attribute
• 769357 – Implement <input type=date> min attribute
• 769359 – Implement <input type=date> step attribute
• 769370 – implement valueAsNumber and valueAsDate for input <input type=date>
• 769379 – implement the value sanitizing algorithm for <input type=date>
• 769385 – add date to the list of valid types attributes for <input>

http://viptopia.net/join.php

Click on the date of birth field. A jquery date picker should pop up. Befor today, it did. For years, web developers have been using the type="date" attribute to call a Jquery popup date picker when the input field is clicked.

It seems as though the Chrome browser folks, and now the Firefox browser folks, suddenly believe that they need to control the behavior of all input field with a date attribute set. I can't help but wonder why.

What it all means to website developers, is that custom date pickers can no longer be called with an onclick event for input fields with a dat attribute set. No one will want to wait to find out what all the browser folks have in mind, so now we'll all have to set date fields on input forms to type="text" and call the custom date picker in text fields that have a specific class name, and remove the type='date' attribute.

Whatever cute little plan for the type="date" mozilla may have, is irrelevant, because no website dev will want to use it.

As temporary fix for Firefox 19 -- before an actual date picker widget is wired up to the field -- you could follow the lead of this demo page and test to see whether the date type is actually supported: http://jsfiddle.net/p58bt/241/. I don't know whether that will work with the older libraries used on viptopia.net (jQuery v1.3.2 and jQuery UI 1.7.2).

Also, you might prefer not to add yet another library...

Related article: http://tjvantoll.com/2012/06/30/creating-a-native-html5-datepicker-with-a-fallback-to-jquery-ui/

What version of Jquery are you using? Support for older versions is flaky at best, so you should update. Do you have an example website?

Hi everyone, I have similar problem. After updating FF 19 -> 20 , datepickers have a failure. Month and Year selects couse whole picker DIV to hide - should work like day number selector - just stay in place. It happends only in FF 20 - works in other browsers and FF 19. Does any one have the same problem?

Hi lukaszwierz, could you post a link to a page that has this problem so we can take a look at it?

Hi, sadly I can't do that because of security mesures ;/... And bigger problem is that we've made some coding around datepicker so even if You had access you probably that its probably our fault. But like I said thing worked in FF 19, and works in chrome, opera, ie, and safari. But on the other hand when I go to jQuery-UI site and look at their examples it works to.... I wrote here just like a lucku shot ;)

Hi lukaszwierz, do you have another computer where you could test the beta of Firefox 21? If it's a problem limited to Firefox 20 for internally facing systems, perhaps it is not worth doing a lot of debugging? http://www.mozilla.org/firefox/beta/

For me at least, the issue is now irrelevant. Apparently the built in popup date picker that no serious web developers will not want, is here to stay.

The only option now, is to remove the type="date" attribute from input fields where you want to call a custom date picker. Instead, you should set the field to type="text" and call the custom date picker for input fields with a specific class name.

Thanks jscher2000 for the tip. Tried it and in 21 it doesn't work also. something in update 19->20 must have change some thing. Looking in to list of changes but I don't see anything relevent. Any way thanks for help. Will try to dig this deaper.

Ok I found source of my problem. Actually my colleague found it. Still dont know if its a bug but maybe it will help someone. We had a function that supposed to hide datepicker element on mouse click anywhere else than datepicker.

$(document).click(function(){ var $visibleSlidePanes = $('.popup-content:visible'); if (!$visibleSlidePanes.data('on-pane-click')) { $visibleSlidePanes.trigger('slideclose');

$visibleSlidePanes.hide(); var $slidePane = $visibleSlidePanes.closest('.slide-pane'); $slidePane.find('.want-selected-flag').removeClass('selected'); $slidePane.removeClass('selected'); } $visibleSlidePanes.data('on-pane-click', false); });

It seems like with FF 20 clicking an option of select inside a datepicker is treated as outside. When I dig deaper i took event and target of click and everywhere outside it worked giving me back DIV, UL .... HTMLObjects, but when clicked on option of select it gave me just document Object. I made a quick fix and it seems to work.

lukaszwierz I also am finding the same problem with FF 20 on both Mac and PC. I cannot reproduce it on Jquery UI 1.10.2, but I can with 1.8.16.

This is when you have the datepicker configured with changeMonth: true and changeYear: true.

I am currently debugging through the 1.8.16 to figure out why I am getting a document.click event which is propagating up when either month or year is selected.

This the code that firefox 20 broke for me. I have not tested 19.

http://jsfiddle.net/nFHdg/2/

After selecting a year the datepicker disappears because a document click event is triggered where the target is [object HTMLDocument]. In other browsers this event is not triggered at all.