Form validation script - help needed!

**UD4inBrampton** · Mar 15, 2004, 10:31

Hi Folks,

I have a text field on one of my form pages, which requests either a 5 digit US zip code, or the first 3 digits of a Canadian postal code (example H9C).

Presently the javascript I have on the page which validates the users input, only checks to see if they have entered in 3 or more numeric, or alphanumeric digits .

I would actually like the validation script first to examine if the input was all numeric, and if it was? It would check to make sure the user entered in exactly 5 digits. If they didn't? the error message pop up screen needs to read "You must enter in a complete 5 digit zip code". (This part would make sure American users are only able to enter in a full 5 digit zipcode)

The second part of the validation script will need to look at the users input again, and if the user entered in a alphanumeric value. The script must check to make sure only 3 digits were entered. If the user entered in more than 3 alphanumeric digits, then the error message needs to read "You must enter in only the first 3 digits of the postal code" (This will ensure Canadians only enter in the first 3 digits of their postal code and not 7)

Hopefully some one has already written this script, or would be kind enough to write it for me. The name of the text field which users enter in either their zip code, or their partial postal code is named "searchfield"

Thanks in advance for any help you can provide!

Take care,

Robert

**jojolepabo** · Mar 16, 2004, 08:07

you should match your input with a regular expression:

if (str == str.match(regex))
{
treatment();
}

the regular expression to check for only numbers is the following:

/[0-9]+/

the regular expression to check for alphanumeric string is the following:

/[a-zA-Z0-9]+/

so you would have something like this:

Code:

checkTextArea()
{
   var str = myform.mytext.value;
   if(str == str.match(/[0-9]+/)
   {
       return (myform.mytext.length==5);
   }
   if(str == str.match(/[a-zA-Z0-9]+/)
   {
       return (myform.mytext.length==3);
   }
   return false;
}

this will only throw true or false, now if you want to add your messages you should adapt this to your needs (eg: if (myform.mytext.length!=5){alert("US zip code must contain exactly 5 digits"); return false;}return true; )

**adios** · Mar 16, 2004, 14:29

Robert (great name)...had to get back to work so, abandoned this in midstream. See if it's close. Weird bug in Mozilla; see if you can ID it. I'm hoping it'll just go away.

Tossed in an interesting faq from this here blog.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>untitled</title>
<style type="text/css">

body {background: #d8d8f0;}
input {font: 12pt verdana;}
pre {font-size: 8pt;}

</style>
<script type="text/javascript">

function is_OK_postcode(oText)
{
	oText.value = oText.value.replace(/\s/g, '');
	var searchfield = oText.value, msg = '';
	var is_empty = (/^\s*$/gi.test(searchfield));
	var is_junk = (/[^A-Z\d]/gi.test(searchfield));
	var is_all_alpha = (/^[A-Z]+$/gi.test(searchfield));
	var is_all_digits = (/^[\d]+$/gi.test(searchfield));
	var is_five_digits = (/^\d{5}$/g.test(searchfield));
	var is_three_alphanum = (/^[A-Z\d]{3}$/gi.test(searchfield));
	var is_ok_canadian = (/^[ABCEGHJKLMNPRSTVXY][\d][A-Z]$/gi.test(searchfield));
	if (is_empty)
		msg += 'Please enter a zipcode (USA) or Canadian postal code (first 3 characters).';
	else if (is_junk || is_all_alpha)
		msg += 'Not a valid zipcode (USA) or Canadian postal code. Please correct.';
	else if (is_all_digits && !is_five_digits)
		msg += 'Please enter 5 numbers for a (USA) zipcode.';
	else if (!is_all_digits && !is_three_alphanum)
		msg += 'Please enter only the first 3 digits of the (Canadian) postal code.';
	else if (is_three_alphanum && !is_ok_canadian)
		msg += 'Please enter a valid (Canadian) postal code.';
	if (msg != '')
	{
		alert(msg);
		oText.focus();
		oText.select();
		return false;
	}
	else return true;
}	

function checkform(oForm)
{
	if (!is_OK_postcode(oForm.searchfield)) return false;

	// other routines

	return true;
}

</script>
</head>
<body>
<hr />
<pre>
RegEx Patterns to Match Zip Codes and Postal Codes

Need to match zip codes or postal codes? Of course, no two countries use the same format. But here are 
solutions for USA, Canada, and the United Kingdom.

The USA format is simple, five digits as 99999 or zip+4 as 99999-9999. A simple RegEx could be:

\d{5}(-\d{4})?


If you want to omit zips with a trailing hyphen (as in 99999-) then you could use a lookahead condition:

\d{5}(?(?=-)-\d{4})

Canada is a little trickier, the format looks like A1A 1A1 which can be easily matched with

[A-Z]\d[A-Z] \d[A-Z]\d

However, there is one rule that may be employed to improve validation, the opening character of the set 
of characters (technically called the "forward sortation area" or FSA) identifies the province, territory, 
or region (there are 18 characters that are valid in this position, A for Newfoundland and Labrador, B for 
Nova Scotia, K, L, N and P for Ontario excluding Toronto which uses M, and so on.), and so validation should 
ideally check to ensure that the first character is a valid one. And so, here is a better Canadian postal 
code regular expression:

[ABCEGHJKLMNPRSTVXY]\d[A-Z] \d[A-Z]\d
</pre><br /><hr />
<form action="javascript&#58;alert('ok')" onreset="elements[0].focus()" onsubmit="return checkform(this)">
<input type="text" name="searchfield" value="" size="5" maxlength="5" />_____postcode<br /><br />
<input type="submit" value="test">_____submit<br /><br />
<input type="reset" value="clear">_____reset
</form>
<hr />
</body>
</html>

**UD4inBrampton** · Mar 17, 2004, 20:00

Thanks for your replies guys! But regretfully I couldn't get either script to work. Which is most likely due to my total lack of skills when it comes to javascript.

Possibly what I could do is send you guys a copy of the code I presently have on the page and you could point out what i need to do.

If you could do this for me that would be great. To let me know - please either send me a e-mail or leave a new post here.

Thanks again guy's,

robert

**adios** · Mar 18, 2004, 11:36

This is a public forum, so the preferred approach would be to continue this thread so everyone may participate.

The SitePoint Forums have moved.

User Tag List

Thread: Form validation script - help needed!

Thread Tools

Display

Form validation script - help needed!

Bookmarks

Bookmarks

Posting Permissions