HTML and CSS Reference
In-Depth Information
input type="datetime-local" : The same as datetime , but minus the time zone. This input
assumes the time given is in the user's local time zone, whatever that may be (perhaps provided
separately or derived from geolocation data). Example: 2012-07-22T08:45
input type="month" : For the year and month. Example: 2012-07
input type="week" : For the year and calendar week, indicated as a number between 1 and
53). Example: 2012-W29 (the twenty-ninth week of 2012)
input type="time" : For hours and minutes, but not seconds, and without any time zone
information. Example: 08:45
Each of these new input types automatically carries its value in a machine-readable format while
presenting the user with a simplified, human-friendly interface. That is, in browsers that support these input
types, and that's a short list at the time we write this. Opera is farthest in the lead, having supported the
various date and time inputs since version 10.62 (released in late 2010). For example, current versions of
Opera display a pop-up calendar (Figure 8-8) for date , month , week , datetime , and datetime-local
Figure 8-8. Opera displays a calendar interface when a date field receives focus. A user can select a year, month, and
day with a few clicks and the browser will automatically enter the date in a machine-readable format.
Some current browsers may recognize these input types but don't yet offer a special interface, and others
don't yet recognize these input types at all, falling back to a basic text field. Unfortunately this means older
and non-supporting browsers can't automatically format the data and will just accept whatever text they're
given. Until browser support is more widespread and consistent, one interim solution is to offer a
JavaScript date or time picker (like the ones websites have been using for years) only to browsers that
don't support these new HTML5 inputs, and more advanced browsers can use their built-in interfaces. If
you use these new date and time inputs in your web forms, plan accordingly and test thoroughly
Date and time inputs can carry optional min and max attributes, specifying the control's minimum and
maximum values. The attribute's value is a date or time (or full datetime) in the same format as the
particular input type accepts. Time inputs don't differentiate between AM and PM, so you may need to
specify a 24-hour clock instead of a 12-hour clock.
Search WWH ::

Custom Search