HTML5 form test

General considerations

HTML5 provides some options to check inputs before sending it to the server, respectively to help users to fill a form with useful values. Such help and control was performed before with java-script, therefore a big progress to get rid of scripting and to replace it with declarative methods. On the other side, because all this input can be manipulated, one has to check all inputs finally at the server again.

First test

Fill the form, you will see your input after sending:

submit
required
Give some required text, you need to do so, if you want to send the form:
email
Give email (try both wrong text an unusual email addresses):
URL
Give URI/IRI (try both wrong text an unusual URI/IRI):
telephone number
Give a telephone number (try valid and invalid):
number (obviously only decimal)
Give a number n (valid -6 < n < 6 step 0.5):
range (obviously only decimal)
Give a number n (min -5, max 5, any step):
color
Give a color (hexadecimal #000000 to #ffffff):
search
Give a search pattern (a colour value: [A-Fa-f0-9]{3,6}):

Second test: Time and Date

submit
time 1
Provide some time information (24 hour value, between 10:00:00.0 and 20:00:00.0):
time 2
Provide some time information (24 hour value, in minutes):
date
Provide some date information (between 2010-01-01 and 2015-12-31):
month
Provide some month information (between 2010-01 and 2015-12):
week
Provide some week information (between 2010-W01 and 2015-W53):
datetime
Provide some UTC date and time information (between 2010 and 2015):
datetime-local
Provide some date and time information (between 2010 and 2015):

Third test: Common input attributes

submit
placeholder and multiple
Provide a list of emails, with comma separator:
list and datalist
Chose telephone number from list:

Fourth test: Delocalised form elements

In HTML5 it is possible to place form input elements outside the form element, just indicating the relation to the form.

Submit forms

Text to submit

Fifth test: Submit a key

Key
Submit form

Sixth test: output

submit
Numbers a not smaller than 0.001:
b not smaller than 0.001:

log(1) * log(1) = 0

Seventh test: no validation

Do not provide the required value and use wrong input values and send the form without validation:

submit
required
Give some required text, you need to do so, if you want to send the form:
datetime-local
Provide some date and time information (between 2010 and 2015):
number (obviously only decimal)
Give a number n (valid -6 < n < 6 step 0.5):