The new form for HTML5

The new elements for the forms required by HTML5 are indicative of the objectives of the new version of the language: to create, with the simple markup, more functional solutions (currently achievable only by using scripting languages) in order to meet the changing needs of the Internet.

In this article we will see, through numerous examples, Ole innovations introduced by HTML5 in the creation of web-form.

Once again I should remind the reader that not all browsers provide support to the new markup language (HTML 5 is not yet a standard, but a language under development) for so in order to correct display of the examples, I suggest browser to use already prepared, for example, Opera.

New items and extensions

The main changes relate to the use of Form objects dedicated (new tags) and extensions.

The use of extensions allows, through the classic input tag, the automatic validation of data and / or expand the potential to create complex tools such as, for example, calendars.

As a starter I suggest you an example: we replace the simple text field (<input type="text"/>) with something more specific: a URL field. Let's see the code:

 



 <form>







 URL: <input name="url" type="url" value="" required>







 </ Form>

 

Apparently you do not notice any difference in the view, but at an eye immediately experience the changes from the classic HTML4 markup:

• The specific type ("url")
  The specification of the expected data type is useful to the language parser to parse the content with appropriate and notice the presence of errors;
• the keyword "required"
  Although this is new HTML5, as suggests, requires the completion of the field as mandatory (but we will return later).

Before going into the new HTML5 I think it should be a quick review about the controls for the modules offered by HTML4.

• <<
• 1
• 2
• 3
• 4
• 5
• >>