WebDeveloper.com �: Where Web Developers and Designers Learn How to Build Web Sites, Program in Java and JavaScript, and More!   
Web Developer Resource Directory WebDev Jobs
Animated GIFs
CSS
CSS Properties
Database
Design
Flash
HTML
HTML 4.01 Tags
JavaScript
.NET
PHP
Reference
Security
Site Management
Video
XML/RSS
WD Forums
 Client-Side
  Development

    HTML
    XML
    CSS
    Graphics
    JavaScript
    ASP
    Multimedia
    Web Video
    Accessibility
    Dreamweaver
    General
    Accessibility
    Dreamweaver
    Expression Web

    General

 Server-Side
  Development

    PHP
    Perl
    .NET
    Forum, Blog, Wiki & CMS
    SQL
    Java
    Others

 Site Management
    Domain Names
    Search Engines
    Website Reviews

 Web Development
  Business Issues

    Business Matters

 Etc.
    The Coffee Lounge
    Computer Issues
    Feedback




Client-Side Form Verification with JavaScript [Sample]

Client-Side Form Verification with JavaScript [Sample]

by Heidi Brumbaugh

Sample page for JavaScript Tutorial

Press the submit button to verify form data.

Your name:
Your email:
Your phone number:

Here's the source code to the above example:

  <head> <title>Javascript Sample Page</title> <script language="JavaScript"> <!-- to hide script contents from old browsers function VerifyData() { // Source code to check form data goes here. // Create a variable to keep track of whether the form is valid. // Initializing this value to 1 means, in effect, that // the form is valid unless the value changes sometime in the // routine. var valid = 1 if (document.Customer.FirstLast.value == "") { valid = 0 } if (document.Customer.Email.value == "") { valid = 0 } if (!CheckPhoneNumber(document.Customer.Phone.value)) { valid = 0 } // Here we decide whether to submit the form. if (!valid) { alert("Please complete all the form fields and enter a valid phone number.") } return valid } function CheckPhoneNumber(TheNumber) { var valid = 1 var GoodChars = "0123456789()-+ " var i = 0 if (TheNumber=="") { // Return false if number is empty valid = 0 } for (i =0; i <= TheNumber.length -1; i++) { if (GoodChars.indexOf(TheNumber.charAt(i)) == -1) { // Note: Remove the comments from the following line to see this // for loop in action. // alert(TheNumber.charAt(i) + " is no good.") valid = 0 } // End if statement } // End for loop return valid } // end hiding contents from old browsers --> </script> <link rel="SHORTCUT ICON" href="http://webdeveloper.com/favicon.ico"> </head> <body> <h2>Sample page for JavaScript Tutorial</h2> Press the submit button to verify form data. <p> <form name="Customer" action="" method="POST" onsubmit="return VerifyData()"> Your name: <input type="text" name="FirstLast" size="30" maxlength="75" value=""> <br> Your email: <input type="text" name="Email" size="30" maxlength="75" value=""> <br> Your phone number: <input type="text" name="Phone" size="30" maxlength="75" value=""> <br> <input type="submit"> <input type="reset"> </form> <p> </body> </html> 



HTML5 Development Center


Recent Articles