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

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 both implementations based on compatibility, that would be ideal.

Is there any way to specify the output of the value given by an HTML datepicker? The default for opera is yyyy-mm-dd, and I very explicitly need dd-MMM-yyyy.

Is there any way to control this output, currently?

Answers:

Answer

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).

Answer

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

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.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.