Home arrow JavaScript arrow Page 2 - Form Validation with JavaScript Regular Expressions (Part 2)

Form Validation with JavaScript Regular Expressions (Part 2)

Form validation is an issue many websites must deal with. In this second article in a two-part series, you will use the JavaScript regular expressions you learned in the first article to put together a script that will validate a range of form inputs.

Author Info:
By: Dan Wellman
Rating: 4 stars4 stars4 stars4 stars4 stars / 132
May 17, 2005
  1. · Form Validation with JavaScript Regular Expressions (Part 2)
  2. · User-friendly enhancement
  3. · Defining the regular expressions
  4. · Testing the values submitted

print this article

Form Validation with JavaScript Regular Expressions (Part 2) - User-friendly enhancement
(Page 2 of 4 )

I havenít included it in this example, but another user-friendly feature that would enhance this form would be a function using the focus method, which highlights all of the text in a field if that field is selected. This means that the user can easily retype any invalid answers. This example has been tested and found to work on MSIE, Netscape Navigator 7 and FireFox, so you can be sure that a wide base of visitors will find this form fully functional. 

We can then build the following script that is inserted into the head of the document and called on submission of the form. If this page were to be used on the Internet, it would be a good idea to separate the script from the main document, and allow it to reside in its own file in a protected folder within the siteís directory structure (probably the scripts folder). This would be safer, as the file would not be directly viewable, and would therefore not expose the logic behind your validation scheme. Forms have traditionally been popular points of entry for hackers.

First, you need to get all of your field inputs into variables that the script can work with. These will go at the very beginning of the validate() function:


function validate(){

var fname = document.myForm.fname.value;

var lname = document.myForm.lname.value;

var house = document.myForm.house.value;

var pcode = document.myForm.pcode.value;

var telno = document.myForm.telno.value;

var email = document.myForm.email.value;

var verEmail = document.myForm.verifyEmail.value;

var url = document.myForm.url.value;

var dob = document.myForm.dob.value;

blog comments powered by Disqus

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials