Help on form

[mpowers49]

I’m doing an assignment on validating forms. On my functions I have all the id names right:

function checkForm(){
var purchase_ok = document.order.total.value;
var address_ok = document.getElementById(“street”).value;
var name_ok = document.getElementById(“name”).value;
var city_ok = document.getElementById(“city”).value;
var zip_ok = document.getElementById(“zip”).value;
var email = document.getElementById(“email”);
var cname = document.getElementById(“cname”).value;
var cnumber = document.getElementById(“cnumber”).value;

and my if statements for the vars like this one to pop up the alert when nothing is entered:

if(name_ok ==“” ){
alert(“Please enter your name”);
return false;
}

However on the very last field it just clears everything instead of giving me an alert message. Does anyone know what the problem might be. I’m a beginner obviously. Is there a better way to code the if statements?

[dresden_phoenix]

It’s difficult to answer without seeing your whole script. debugging usually requires precise observation ( sometimes the issue can be as simple as an empty space or miscapitalized word)…for example, document.getElementById

In the meantime consider this approach:

    function checkForm(){
    	var eMessage=false;
    	var fields = ['street', 'name','city','email','zip','cname','cnumber']; //the  ID names of the fields you want to validate
    	var fieldTests= {
    		street: { isBlank:'address'  },
    		name:{ isBlank:'name'  },
    		city:{ isBlank:'city'  },
    		email:{ isBlank:'email'  },
    		zip:{ isBlank:'ZIP code' , isRealZIP:'enter a real ZIP' },
    		cname:{ isBlank:'customer Name'  },
    		cnumber:{ isBlank:'customer Number'  }
    	}; // an object containing the test:error string for each field to be validated.
    	var testEl;
    	var testElVal;
    	
    	for (i=0; ft=fields.length; i<ft; i++){// loops through the fields
    		testEl=document.getElementById(fields[i]);
    		testElVal=testEl.value;
    		// logic for each valation  goes here, for example:
    		// this test for blank entries     
    		if(fieldTests[fields[i]].isBlank !== undefined){  //is there a test for blank for this field? ---> isBlank:???
    			 if (testElVal === '' ) { // this is your validation logic here
    				 eMessage = eMessage + "enter your "+ fieldTests[fields[i]].isBlank+"\n";// appends error message
    			 }
    		}
    		// test for REAL ZIP 
    		elseif(fieldTests[fields[i]].isRealZIP !== undefined) {  
    		     if (testElVal <10001  ||  testElVal > 99999) { // (sample logic only..not a real test for ZIP!!!)
    			     eMessage = eMessage + fieldTests[fields[i]].isRealZIP; // appends error message
testEl.value=''; //reset field;
    			 }
    	    }
    	}
    	
    	// display an alert of all the errors;
    	if (eMessage !== false) {alert (eMessage);}
    }

The the key here is not just code but organization ( this helps in debugging!!!)

‘fields’ is an array that contains ALL the fields you want to test, if you ever add /remove a field from your form all you need do is add/remove its name in this array

‘fieldTests’ is a nested associative array ( an object…since js doesn’t really have associative arrays)… with the name of each field you want to test and and the test you want to run, and what the error message should say.

This way if you want to add/remove a test to a specific field you only need to add the appropriate values to ‘fieldTests’

within the loop you will see separate and encased logic for each TEST. These could even be separate function calls…but I was trying to keep this example basic. Still, you could add any number of test as shown.

hope that helps