!!HELP!! - Function sends after validation alert doesn't return user to form

[Chezshire]

Hello everyone,

  I'm a student studying JavaScript and I've been struggling all weekend with my form - I'm trying to get the zip code field to require a proper zip code be entered by the user, if they don't enter a proper zipcode, validation is run and the form pops an alert to tell the user to try again. At the moment, every goes well until the form sends it's notice, once you click ok on the notice, the form send to the form handler rather then returning to the form. I'm completely lost -- any help is greatly appreaciated.

 

My JavaScript:

<script type="text/javascript">
	//place local js code here

	function init()
	{//init places focus on the first form element
		document.myForm.fName.focus();
	}

	//here we make sure the user has entered valid data	
	function validateZIP(field) {
			var valid = "0123456789-";
			var hyphencount = 0;

			if (field.length!=5 && field.length!=10) {
			alert("ALERT FROM VALIDATE ZIP - Please enter your 5 digit or 5 digit+4 zip code.");
			return false;
			}
			for (var i=0; i < field.length; i++) {
			temp = "" + field.substring(i, i+1);
			if (temp == "-") hyphencount++;
			if (valid.indexOf(temp) == "-1") {
			alert("ALERT FROM VALIDATE ZIP - Invalid characters in your zip code.  Please try again.");
			return false;
			}
			if ((hyphencount > 1) || ((field.length==10) && ""+field.charAt(5)!="-")) {
			alert("ALERT FROM VALIDATE ZIP - The hyphen character should be used with a properly formatted 5 digit+four zip code, like '12345-6789'.   Please try again.");
			return false;
			}
		}


	}


	function checkForm(thisForm)
	{//check form data for valid info

		if(empty(thisForm.lName,"Please Enter Your LAST NAME")){return false;}
		if(empty(thisForm.address1,"Please Enter Your LEGAL ADDRESS")){return false;}
		if(empty(thisForm.state,"Please select A STATE")){return false;}			

		if(validateZIP(thisForm.zip,"ALERT FROM CHECK FROM - Please enter a valid 5 digit+four US POSTAL ZIP CODE")){return false;}


		return true;//if all is passed, submit!
	}

	addOnload(init); //with addOnload() we can add as many functions as we wish to window.onload (one by one)!
</script>	

 

 

Current form example here:

file:///Applications/xampp/xamppfiles/htdocs/xampp/WEB/SCC/web150/wk06a.shtml

 

Thank you for any help - I'm not sure what i'm doing wrong, so if you see my blunder please be specific as I'm in way over my head - thanks a lot!

[Psycho]

Current form example here:

file:///Applications/xampp/xamppfiles/htdocs/xampp/WEB/SCC/web150/wk06a.shtml

 

Um, that is a link to a file on your local computer - not a link that is web accessible.

 

Anyway, you don't show how the validation scripts are initiated. But, I will *guess* what the problem is. In the form tag you should use the onsubmit trigger to call the valiadtion scripts. Your validation scripts seem to return true/false as would be expected.

 

BUT, the onsubmit trigger must be formated to ALSO return true/false. Here is how the FORM tag shoudl look

<form name="something" action="something.php" method="post" onsubmit="return checkForm(this);">

 

Note the "return" inside the onsubmit parameter value.

[Chezshire]

Thanks -- That helped to point me to the place I needed to look at to pull the whole thing together -- Thank you very, very much mjdamato!