HTML5 added new features into the FORMS, In this post we will learn about these features.

If in html4/xhtml you could define only a few types of inputs, in HTML5 you can define a lot more, for example:

Image by adria.richards via Flickr

• color, so that browser that supports that input will display a popup with colors to choose from.
• date, will display a date-picker
• email, will expect to have an email in the fields value. If we add a required=”required” attribute then the browser will preform a validation for us
• number, same as email field…
• range, we will have a field that we can select from a pre defined range in the attributes of the element min=”1″ and max=”10″
• search, field that we can search within and add auto-complete attribute so that it will display automatically the options that we search for
• tel, will expect to have a phone number as a value
• url, same as tel just for a url link to be in it as a value

These are most of the new input types that we now have in HTML5 forms.

In addition we can add to any input the attribute “required” and the browser will do a validation for us in that field when we press submit on that form.

That is pretty covers most of the new features in HTML5 forms.

Be Sociable, Share!

•