Know about HTML5 Form Validations with Pattern Matching

HTML5 Form validation is another type of client side validation . In HTML5 validation no javascript or jquery needed. Using HTML5 we can validate form with pattern.

Different type of Pattern Matching in HTML5

1. Letter only
2. Number only
3. Email
4. Password
5. Phone no
6. Alphanumeric
7. URL

Letters Only

pattern=”[A-Za-z]+” accepts only capital or small letters.

Number only

pattern=”[0-9]+” accepts only numbers 0, 1, 2….

Email

pattern=”[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]2,4$” accepts valid email address

Password

pattern=”(?=.*d)(?=.*[a-z])(?=.*[A-Z]).6,” accept at least one number and one uppercase and lowercase letter, and at least 6 or more characters

Phone no

pattern=”[0-9]10” accepts only numeric values with 10 digit.

Alphanumeric

pattern=”^[a-zA-Z][a-zA-Z0-9-_.]5,12$” accepts alphanumeric values letters and digits.

URL

pattern=”https?://.+” required title=”http://phpgurukul.com” accepts valid web url starting with http://.