Thanks to visit codestin.com
Credit goes to www.scribd.com

0% found this document useful (0 votes)
20 views27 pages

Form Validation Techniques

Uploaded by

palash gupta
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)
20 views27 pages

Form Validation Techniques

Uploaded by

palash gupta
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
You are on page 1/ 27

UNIT - 4

Form Validation

STME, NMIMS, Navi Mumbai


Form Validation
• Validation is a process of checking the input values whether they are
correct or not.
• For example:
• First Name can’t be blank
• First Name can contain only alphabets
• Email should be in correct format
• Amount should be in between 100 to 1000.
• Password can be 8 maxlength.

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
Color coding the required
• Name, Email, Age, Create ID is required to be
filled.

STME, NMIMS, Navi Mumbai


Min and max to create range of attributes.
• The attributes works with the following input types: number, range,
date, datetime, datetime-local, month, time and week.

STME, NMIMS, Navi Mumbai


Pattern in Input
• This attributes helps the developer to specify a JavaScript regular
expression for the field’s value to be checked against.
• Hence we can use pattern to implement specific validation like phone
number, product code, zip code etc.
• The pattern attribute works with the following input types: text,
search, url, tel, email, and password.

STME, NMIMS, Navi Mumbai


Pattern

STME, NMIMS, Navi Mumbai


Using regular expressions
• Regular expressions give you much more power to handle strings in a script.
• They allow to form patterns that can be matched against strings, rather than trying
to use the String object’s methods, which may make it more difficult to be precise.
• For example, you may want to know whether the value entered in a text box for an
e-mail address included at least one character at the beginning, followed by an at
(@) symbol, followed by at least one character, followed by a dot (.), followed by
at least two more characters (matching a traditional e-mail address like
[email protected] or the shortest type of email address [email protected]).

STME, NMIMS, Navi Mumbai


Creating regular Expressions

• Example

STME, NMIMS, Navi Mumbai


Test regular Expression

• Example

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
Adding Flags

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
STME, NMIMS, Navi Mumbai
Regex Examples
• Test a non decimal number
• Test Alphabet

• Check 6 digit Pincode

• Check number followed by alphabet

• Check email ID

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
Name validation

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
Validation check for non empty string

STME, NMIMS, Navi Mumbai


Activity

STME, NMIMS, Navi Mumbai


To display number of elements in forms on
HTML page

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
Using Form Names

STME, NMIMS, Navi Mumbai


Using an ID

STME, NMIMS, Navi Mumbai


Using Properties and Methods of Form object

STME, NMIMS, Navi Mumbai


STME, NMIMS, Navi Mumbai
STME, NMIMS, Navi Mumbai

You might also like