Example of rendering, usage, visualization and validation of the HTML5 input form's elements.

All fields below are set as mandatory, using the attribute required: notice as validation occurs using pure HTML5 (no JavaScript involved): the style's changes are due to simple CSS rules. Moreover, the second input (the url) exploits a regular expression (an HTML5 attribute) to validate the url pattern.

The first two fields are created as simple markup code (in the page's source), while the other fields are added at run-time (using JavaScript). This approach allows to insert only those inputs actually supported by your browser.

To see the JavaScript code click on the Show code, Show markup or Show style labels below.

Back