Using the input Element to Obtain Times and Dates
Description
HTML5 has introduced some input element types to gather dates and times from the user. The following list describes these input types.
- datetime - Obtains a global date and time, including time zone.
Example:2014-07-19T16:42:39.421Z - datetime-local - Obtains a local date and time, (with no time zone information).
Example:2014-07-19T16:42:39.421 - date - Obtains a local date (with no time or time zone).
Example:2014-07-20 - month - Obtains a year and month (no day, time, or time zone information).
Example:2014-08 - time - Obtains a time.
Example:17:42:44.746 - week - Obtains the current week.
Example:2011-W30
The following list has additional attributes available for the Date and Time input Element Types.
- list - Sets the id of a datalist element that provides values for the element.
- min - Sets the minimum acceptable value.
- max - Set the maximum acceptable value.
- readonly - Marks the text box to read-only.
- required - Specifies that the user must provide a value.
- step - Specifies the granularity of increments and decrements to the value.
- value - Specifies the initial value for the element.
Example
The following code shows the date type in use.
<!DOCTYPE HTML>
<html>
<body>
<form method="post" action="http://example.com/form">
<p>
<label for="lastbuy"> When did you last buy:
<input type="date" id="lastbuy" name="lastbuy" />
</label>
</p><!-- www. ja v a 2 s . c o m-->
<input type="submit" value="Submit Vote" />
</form>
</body>
</html>