HTML5 new Form Validation

HTML5 New Properties :

Property	Describe
Placeholder	Provides a hint that the input field is empty when it is displayed and disappears when the focus input is obtained
Required	Specifies that the input field cannot be empty
Pattern	Rules Validate the mode of the input field ( Regular Expression )

Example :

<input type= "text" id= "UName" placeholder= " English, numeric length 6-10 characters " Required pattern= "[a-za-z0-9]{ 6,10} "/>

Validity Properties :

Validitystate Object :

Property	Describe
Valuemissing	If the form element has the required Property set , It is required , and if the value of the required entry is null , the valuemissing value returns true if the form is not validated, otherwise it returns false
Typemismatch	input value and Type New form types such as email, Number,url et Span style= "font-family: Arial" > contains an original type validation If the user entered a value that does not match the form type typemismatch true, otherwise returns false
Patternmismatch	The input value does not match the regular expression of the pattern attribute , and if the input value does not conform to the rules for pattern validation mode , the Patternmismatch the value returned true otherwise return false
Toolong	The content of the input exceeds the maxlength attribute-qualified character length Although it restricts the length of the form content when it is entered But in some cases by program If the input exceeds the maximum length setting toolong value return true otherwise returns false
rangeunderflow	The value entered is less than min The value of the attribute If the value entered is less than the minimum rangeunderflow true, otherwise returns false
Rangeoverflow	The value entered is greater than the value of the max attribute , and if the value entered is greater than the maximum value , the rangeoverflow Value returns true, otherwise false
Stepmismatch	The value entered does not matchStepthe rule that the attribute is extrapolated from.Form elements used to fill in values may need to be set simultaneouslyMin,maxand theStepof the Properties,this restricts the input value to be the minimum value andStepsum of multiples of attribute values,For example:range from0to the10,stepattribute value is2,because the legal value is the even number of the range,no other values are validated. If the value entered does not meet the requirementsStepmismatchreturntrueotherwise returnfalse
Customerror	Use custom error verification information . using setcustomvalidity () method custom Error message :setcustomvalidity (message) message, at this time customerror The value of true,setcustomvalidity ( "") at this time customerror The value of false

HTML5 new Form validation