Is it possible to style html5 datetime input?
<input type="datetime" value="2011-08-18T16:49Z">
This ISO date-time format is not overly readable. Is is possible to format the presentation of the value with some pattern using CSS or some other means?
EDIT: I just realized that this question is browser dependent. For example Opera implements this tag with a nice control, where the user just can't enter an invalid date. The browser will then generate a properly formatted W3C datetime string, and send that to the server. Firfox 6 only provides a standard input and doesn't care what's entered at all. Chrome has a plain input field, but requires a valid w3C string to be entered prior to form submission.
So my question probably does not make any sense. So I will ask another one: Are there any guidelines for the browsers that standardize the functionality/presentation of these custom input fields?
Once the form data has been submitted you can format it server-side. If you'd like to do your formatting client-side you can't use CSS but you can use javascript by loading the input value into a Date object and using the various methods of that object to return components of the date (getMonth(), getDate(), getFullYear(), etc...). You can see a basic example at http://jsfiddle.net/G4XGP/.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With