HTML5 forms use date and time controls regularly. HTML5 date and time controls are used by booking sites, scheduling events sites or flight arrivals scan sites.
HTML5 Date and time control is useful in several ways. First, users can see day of the week while picking a date. Second, it prevents users from making a mistake in selecting proper date. For instance, some years have February 28th and not February 29th and some years have February 29th as valid dates.
HTML5 has several controls that deal with date and time. They are different in appearances and behaviors. For example there are two different HTML5 controls for dates and time.
HTML5 Date control: <input type="date"/>
HTML5 Time control: <input type="time"/>
In addition, HTML5 date picker control can be rendered as calendar pop-up control as shown on the picture below.
Pic. 1: HTML5 Calendar Control
There are other HTML5 date and time controls that allow flexibility for your online form when it comes to choosing dates.
HTML5 month control: <input type="month"/>
HTML5 week control: <input type="week"/>
Sample code and HTML5 boilerplate file for four different HTML date and time control presented below:
<title>HTML5 Date and Time Control</title>