0% found this document useful (0 votes)
50 views5 pages

JavaScript Form Validation Guide

The document describes creating JavaScript validation for a registration form. It discusses validating the name, password, email, and phone number fields. Regular expressions are used to validate the fields meet certain criteria, such as having at least 6 characters for the password and being in the proper email format. JavaScript code is provided to validate the form fields using regular expressions and alert the user of any invalid entries.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
50 views5 pages

JavaScript Form Validation Guide

The document describes creating JavaScript validation for a registration form. It discusses validating the name, password, email, and phone number fields. Regular expressions are used to validate the fields meet certain criteria, such as having at least 6 characters for the password and being in the proper email format. JavaScript code is provided to validate the form fields using regular expressions and alert the user of any invalid entries.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd

Week-3 Date: 14-07-08

------------------------------------------------------------------------------------------------------------
AIM: Write JavaScript to validate the following fields of the above registration page.
1. Name (Name should contains alphabets and the length should not be less than 6 characters).
2. Password (Password should not be less than 6 characters length).
3. E-mail id (should not contain any invalid and must follow the standard pattern
name@[Link])
4. Phone number (Phone number should contain 10 digits only).
DESCRIPTION:
JavaScript is a simple scripting language invented specifically for use in web
browsers to make websites more dynamic. On its own, HTML is capable of outputting
more-or-less static pages. Once you load them up your view doesn't change much until
you click a link to go to a new page. Adding JavaScript to your code allows you to
change how the document looks completely, from changing text, to changing colors, to
changing the options available in a drop-down list. JavaScript is a client-side language.
JavaScripts are integrated into the browsing environment, which means they can
get information about the browser and HTML page, and modify this information, thus
changing how things are presented on your screen. This access to information gives
JavaScript great power to modify the browsing experience. They can also react to events,
such as when the user clicks their mouse, or points to a certain page element. This is also
a very powerful ability.
Regular Expressions:
One of the most common situations that come up is having an HTML form for
users to enter data. Normally, we might be interested in the visitor’s name, phone number
and email address, and so forth. However, even if we are very careful about putting some
hints next to each required field, some visitors are going to get it wrong, either
accidentally or for malicious purposes. Here’s where regular expressions come in handy.
A regular expression is a way of describing a pattern in a piece of text. In fact, it’s an
easy way of matching a string to a pattern. We could write a simple regular expression
and use it to check, quickly, whether or not any given string is a properly formatted user
input. This saves us from difficulties and allows us to write clean and tight code.

[Link]
A regular expression is a JavaScript object. There are multiple ways of creating
them. They can be created statically when the script is first parsed or dynamically at run
time. A static regular expression is created as follows:
regx=/fish|fow1/;
Dynamic patterns are created using the keyword to create an instance of the RegExp class:
regx=new RegExp(“fish|fow1”);
Functions:
test(string)- Tests a string for pattern matches. This method returns a Boolean that indicates whether or not
the specified pattern exists within the searched string. This is the most commonly used method for
validation. It updates some of the properties of the parent RegExp object following a successful search.
exec(string)- Executes a search for a pattern within a string. If the pattern is not found, exec() returns a null
value. If it finds one or more matches it returns an array of the match results. It also updates some of the
properties of the parent RegExp object

PROGRAM:
[Link]
function fun()
{

var userv=[Link][0].[Link];
var pwdv=[Link][0].[Link];
var emailv=[Link][0].[Link];
var phv=[Link][0].[Link];
var userreg=new RegExp("^[a-zA-Z][a-zA-Z0-9]*$");
var emailreg=new RegExp("^[a-zA-Z][a-zA-Z0-9_.]*@[a-zA-Z][a-zA-Z0-9_.]*.[a-zA-Z][a-zA-
Z0-9_.]{2}.[a-zA-Z][a-zA-Z0-9_.]{2}$|^[a-zA-Z][a-zA-Z0-9_.]*@[a-zA-Z][a-zA-Z0-9_.]*.[a-zA-Z][a-
zA-Z0-9_.]{3}$");
var phreg=new RegExp("^[0-9]{10}$");
var ruser=[Link](userv);
var remail=[Link](emailv);
var rph=[Link](phv);
if(ruser && remail && rph && ([Link] > 6))
{
alert("All values are valid");
return true;
}
else
{
if(!ruser) { alert("username invalid");[Link][0].[Link]();}
if(!remail) { alert("password invalid");[Link][0].[Link]();}
if(!rph) { alert("phone number invalid");[Link][0].[Link]();}
if([Link] < 6) { alert("password invalid");[Link][0].[Link]();}
return false;
}

[Link]
}
[Link]
<html>
<body>
<center>
<fieldset>
<legend>Registration</legend>
<form action="Database" method="get" onSubmit="return fun()">
<pre>
Name :<input type="text" name="user" size="10"><br>
Password :<input type="password" name="pwd" size="10"><br>
E-mail :<input type="text" name="email" size="10"><br>
Phone Number :<input type="text" name="ph" size="10"><br>
<input type="submit" value="Register">
</pre>
</form>
</body>
<script src="[Link]"></script>
</html>

OUTPUT:

[Link]
[Link]
RESULT:
Thus the home page, login page, catalogue page for the online book store are created successfully

[Link]

You might also like