HTML5 introduces new Input Types that cover a wide range of input
scenarios. With the new input types web will now have better input control
and form validation. This article will discuss the new input types, their
usage and how they help in validation.
Input Type: email
Email input type should be used for fields which should contain email address.
Example:
E-mail: <input type=”email” name=”mail”>
Support:
Input Type: month
Month input type allows user to select month and year
Example:
Birthday month & year: <input type=”month” name=”mnth”>
Support:
Input Type: number
Number input type allows user to select a numeric value
Example:
Age: <input type=”number” min=”18” max=”100” step=”1” name=”mnth”>
Support:
As you can see the number type supports restriction in the form of min and max attributes. You can determine how the numbers can be incremented by setting the step attribute.
Input Type: range
Range input type allows user to select a value from range of numbers. It supports the same restrictions as the number type
Example:
Points: <input type=”rangte” min=”1” max=”5” name=”mnth”>
Support:
Input Type: time
Time input type allows user to select a time.
Example:
Start Time: <input type=”time” name=”mnth”>
Support:
Lohith works in the capacity of Developer Evangelist at Telerik, India and takes care of evangelism in South India. He's an active member and one of the leads for Bangalore DotNet User Group. He tweets:
@kashyapa
