iNET Interactive - Online Advertising Agency
          
   Home    Authors    About    Login    Contact Us
   Search:   
Advanced Search     
  Articles

  ASP (26)
  ASP.NET (19)
  C and C++ (4)
  CFML (2)
  CGI and Perl (16)
  Flash (2)
  Java (7)
  JavaScript (28)
  PHP (92)
  MySQL (13)
  MSSQL (3)
  HTML (34)
  SEO (9)
  Visual Basic (12)
  CSS (13)
  SSI (5)
  XML (12)
  C# (14)

  Developer News

May 13, 2008
Rainbow Links
EarthWeb.com
 
May 13, 2008
MySpace Profile Page Resources
HTML Goodies
 
May 13, 2008
How to Upload Your Photos onto the Web
HTML Goodies
 
May 13, 2008
Email Marketing for MySpace Artists
HTML Goodies
 
May 13, 2008
Top Online Marketing Techniques
HTML Goodies
 
May 13, 2008
I want to create a site just like ____, is that a violation of...
About
 
Courtesy of moreover.com
 
Want to receive new articles via e-mail? Click here!
/Home /JavaScript

Client-side text field validation with Javascript 

  Views:    24237
  Votes:    11
by Steve Adcock 4/30/04 Rating: 

Synopsis:

Javascript is as powerful as any client-side language comes, and text field validation is a tremendously desired capability many webmasters want for their forms. Let's take a look at a little javascript for the purpose of validating feedback forms.
Pages: firstback1 2 forwardlast
The Article

Putting it all together

Alright, I've broken the code down into sections, so let's bring this code together into one HTML document. Here's what a simple form would look like with three text boxes.

<html>
<head>
<SCRIPT LANGUAGE="javascript">

<!--

function focus()
{
  document.forms[0].FirstName.focus();
}

function checkme() //check for required fields
{
    if (document.forms[0].FirstName.value == "")
    {alert("You did not enter your first name. Please provide it.");
    document.forms[0].FirstName.focus();return(false)
    }

    if (document.forms[0].MiddleName.value == "")
    {alert("You did not enter your middle name. Please provide it.");
    document.forms[0].MiddleName.focus();return(false)
    }

    if (document.forms[0].LastName.value == "")
    {alert("You did not enter your last name. Please provide it.");
    document.forms[0].LastName.focus();return(false)
    }

}
//-->

</SCRIPT>
</head>
<body onLoad="focus()">

<form action=test.php method=post onSubmit="return checkme()" name=Feedback>
First name: <input type="text" name="FirstName"><br>
Middle name: <input type="text" name="MiddleName"><br>
Last name: <input type="text" name="LastName"><br>
<input type="Submit">
</form>

</body>
</html>

Enjoy.

Pages: firstback1 2 forwardlast

Similar/related articles:


 
  Sponsors