---

Search posts under HTML5:

---

Time & DateTime picker in HTML5

How to provide option to choose Time and Datetime in HTML5?

To provide option to user to select time, we can use type attribute to time. Similarly, to provide option to select date and time both, we can use type attribute to datetime-local.

Despite the fact that datetime is also a valid type value, it doesn't work in most of the browser.

Select Time:
 <input type="time" name="myDateTime" id="myDateTime" />
 <br />
 Select Datetime Local:
 <input type="datetime-local" name="myDateTimeLocal" id="myDateTimeLocal" />
 <br />

1. time allows user to select time
2. datetime-local allows user to select date as well as time.

Output

Difference between datetime and datetime-local?

There is slight difference between datetime and datetime-local type attribute value. 

• datetime - tries to capture the user time zone
• datetime-local - only capture the current time of the user (no time zone).