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

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 / 109
May 17, 2005
TABLE OF CONTENTS:
  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
SEARCH DEVARTICLES

TOOLS YOU CAN USE

advertisement
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:

<script>

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
JAVASCRIPT ARTICLES

- More Top jQuery Tutorials for Beginners
- More Top jQuery Plugins for Menus
- Top jQuery Tutorials for Beginners
- New UI Framework and SDK for JavaScript Rele...
- JavaScript OpenPGP Tool, Node.js 0.6.3 Avail...
- Yahoo Releases Cocktails Language and Develo...
- Customizing jQuery Slideshows: Dynamic Contr...
- Customizing jQuery Slideshows: the animate()...
- Customizing jQuery Slideshows: slideUp() and...
- Customizing jQuery Slideshows: hide() and sh...
- Web Workers: Performing Calculations in Para...
- More Top JavaScript Frameworks and Libraries
- More Dynamic jQuery Styling Techniques
- The Top JavaScript Libraries
- The Top JavaScript Frameworks

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



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