Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

html5 datetime input - is it possible to style value presentation?

Tags:

html

css

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?

like image 472
ak. Avatar asked Oct 24 '22 02:10

ak.


1 Answers

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

like image 143
Joe Landsman Avatar answered Oct 27 '22 09:10

Joe Landsman