0% found this document useful (0 votes)
8 views1 page

HTML5 Form Validation Attributes Explained

HTML5 introduced various form validation features that enhance user input handling. New attributes such as required, min/max, minlength/maxlength, step, and pattern allow developers to set specific validation rules for input fields. These features simplify the process of ensuring valid data entry in forms.
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
8 views1 page

HTML5 Form Validation Attributes Explained

HTML5 introduced various form validation features that enhance user input handling. New attributes such as required, min/max, minlength/maxlength, step, and pattern allow developers to set specific validation rules for input fields. These features simplify the process of ensuring valid data entry in forms.
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

[Link]

html

HTML5 form validation features


HTML5 and the modern DOM APIs are already equipped for form validation.
HTML5 arrived in 2008 and brought with it many improvements, including
the input tag, which received several updates around form validation.

Validation attributes

HTML5 added new attributes that declaratively set validation rules for a given input
field. These new attributes include:

 required: Specifies that the field can’t be blank


 min/max: Specifies the range of allowed values for numeric inputs
 minlength/maxlength: Specifies the range of allowed length for text inputs
 step: For a step of n, a numeric input value is only valid if it is a multiple of n
 pattern: Specifies a regular expression that a text input must match

 <input type="email" id="email" name="email"


required>
 …
 <input type="url" id="url" name="url">
 …
 <input type="number" id="numTickets"
name="numTickets" required>

Suppose we wanted to restrict the number of tickets each person


could buy? We can do this by using the max and min attributes:
<input type="number" min="1" max="4"
id="numTickets" name="numTickets">

You might also like