Specifying the value output of of an HTML5 input type = date?

Question

I\'d like to add native date pickers to my application, which currently uses a legacy, home-rolled system. Date input support isn\'t widespread, yet, but if I could present

Answer 1

In Google Chrome, this has recently changed. The values displayed to the user are now based on the operating system locale. The readout, so input.value, always returns as yyyy-mm-dd regardless of the presentation format, however.

Way more useful in my opinion.

Source:

http://updates.html5rocks.com/2012/08/Quick-FAQs-on-input-type-date-in-Google-Chrome

Answer 2

The format of the HTML date field is standard. While it is not possible to change this, you can easily convert from a date object to the format you are looking for given your user has JavaScript enabled.

// Converts any valid Date string or Date object into the format dd-MMM-yyyy
function dateTransform(d) {
    var s = (new Date(d)).toString().split(' ');
    return [s[2],s[1],s[3]].join('-');
}

Otherwise you will need to submit in ISO format and implement a server-side solution. Perhaps in time, this could lead to more usage of the standard date format in every locality.

Answer 3

The HTML5 date input field is specific about the format it uses: RFC 3339 full-date

Is it possible to change the legacy date picker to use yyyy-mm-dd format (and update the server side that reads that)?

I assume not, so then you can add some Javascript glue code that listens for a change event on the HTML5 input and updates a hidden date value field to match the format of the legacy date picker (converts yyyy-mm-dd to dd-MMM-yyyy).