
	ASP Shopping Cart, Forum & BBS - all for $20 from CodeToad Plus!

Home || ASP | ASP.Net | C++/C# | DHTML | HTML | Java | Javascript | Perl | VB | XML || CodeToad Plus! || RAM

Search Site:

Home » Javascript » Article

A Simple Form Validation Script

Article by:

Syed Zulfi (5/19/2003)

	Add to Favourites
	Tell a friend

Summary:

A Simple Javascript function which validates the data in the html forms.

Viewed: 100750 times

Rating (45 votes):

3.5 out of 5

Rate this Article

Read Comments

Post Comments

A Simple Form Validation Script

The Javascript Form Object Properties and Methods can be used to Validate the Html Form.The Multiple Forms in the Html Page are Held as Forms Array.The Javascript Forms Array also holds Information about each Object within the Form tag.

Select All Code


<HTML>
<HEAD>
<TITLE>Form Validation Example </TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function validateForm()
{
var count=0;
var msg="";

    for(i=0;i<=4;i++)
    {
        if(document.UD.elements[i].value=="")
        {
        count=1;
        msg=msg+"\n"+document.UD.elements[i].name;
        }
        else if((i>3) && (count==0))
        {
            return(true);
        }
    }
    for(i=0;i<=4;i++)
    {
        if(document.UD.elements[i].value=="")
        {
        alert("PLEASE FILL IN THE FOLLOWING FIELD(S)\n "+msg);
        document.UD.elements[i].focus();
        return(false);
        }

    }


}
//-->
</SCRIPT>
</HEAD>

<BODY>
<CENTER>
<FONT SIZE="5" COLOR="#006600" FACE="verdana">Form Validation</FONT>
</CENTER><BR><BR>
<FORM METHOD=POST ACTION="http://www.mysite.com" NAME="UD">
<TABLE ALIGN="CENTER">
<TR>
    <TD>First Name</TD>
    <TD><INPUT TYPE="TEXT" NAME="FIRST NAME"></TD>
</TR>
<TR>
    <TD>Last Name</TD>
    <TD><INPUT TYPE="TEXT" NAME="LAST NAME"></TD>
</TR>
<TR>
    <TD>Date of Birth</TD>
    <TD><INPUT TYPE="TEXT" NAME="DATE OF BIRTH"></TD>
</TR>
<TR>
    <TD>Email</TD>
    <TD><INPUT TYPE="TEXT" NAME="EMAIL"></TD>
</TR>
<TR>
    <TD><INPUT TYPE="SUBMIT" VALUE="Submit Form"
    onClick="return validateForm()"></TD>
    <TD><INPUT TYPE="RESET" VALUE="Reset"></TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>

The Multiple Forms in the Html page can be accessed by refering to its Array Index. document.forms[0] refers to the First Form in the Html Page.Similarly the Elements within the Form Tag can be accessed by refering to the elements Array Index. document.forms[0].elements[0] refers to the First element in the First Form in the Html Page.
In the Above Example,the function 'validateForm()' has two loops.The first loop runs thru all the elements in the form and if it encounters any empty elements it append the field name to the message.The Second loop runs thru all the form elements and alerts the user to fill the empty field.

Useful Links

CodeToad Experts

Can't find the answer?
Our Site experts are answering questions for free in the CodeToad forums

Rate this article: Poor Excellent

View highlighted Comments

User Comments on 'A Simple Form Validation Script'

RELATED ARTICLES
Javascript - Enable and Disable form elements by Jeff Anderson This is a relatively little known and under-used feature of javascript which can be very useful in guiding a user through a form. Using the disabled tag, you can switch on and off elements in a form.

Check IsNumeric Function by Jeff Anderson A javascript validation function to check whether the details entered by a user are numeric.

Javascript Onload Event by Jeff Anderson Sometimes you need to perform an action immediatley after the page has loaded. That's when the onLoad Event Handler comes in handy

Form Validation Function by Jeff Anderson A javascript validation function that you can use to validate all types of forms.

Javascript Get Selected Text by Jeff Anderson A cross-browser script to get text selected by the user

JavaScript Field Is Empty Form Validation by Jeff Anderson This javascript function allows you to check whether a form field has been completed or not.

Check Email Validation Function by Jeff Anderson A javascript validation function to check whether the user has entered a valid email address in a form.

Javascript onUnload Event Handler by Jeff Anderson The onUnload Event Handler allows you to perform an action as the user leaves the page.

Multiple submit buttons on a single form by Kiran Pai This script shows you how to submit the contents of a form to different programs depending on which Submit button you press. Additionally it also shows how to call two different functions when you press the Submit button.

Simple date validation by Chris Hogben function that takes a date in three parts, day, month and year - returns true if it's a valid date.

Recent Forum Threads

•	Run a program both on windows and linux
•	VERO.SurfCAM.v2014
•	Schlumberger.Petrel.V2013.2
•	Petrel.V2013.2
•	Altair.HyperWorks.v12
•	VoluMill.v6.1
•	VoluMill.NEXION.6
•	VERO.SurfCAM.v2014
•	Schlumberger.Petrel.V2013.2

Recent Articles

	ASP GetTempName
	Decode and Encode UTF-8
	ASP GetFile
	ASP FolderExists
	ASP FileExists
	ASP OpenTextFile
	ASP FilesystemObject
	ASP CreateFolder
	ASP CreateTextFile
	Javascript Get Selected Text

privacy - contact - advertise - hot links - link to us - submit your article