Forums

jcoder

Am I doing something wrong here? I have two anonymous functions to validate two different forms on two different pages. They both work individually though when I try and put them in the same script.js folder only one works.


<script type="text/javascript">

// Form Validation / Catalog Template ----------------------------------------------------------------------------------------------------------------------

document.getElementById("formValidation").onsubmit = function(){
	if(document.getElementById("reqAddrCont").value == ""){
		document.getElementById("reqAddrCont").className = "error";
		return false;

	}if(document.getElementById("reqAddrName").value == ""){
		document.getElementById("reqAddrName").className = "error";
		return false;

	}if(document.getElementById("reqAddr1").value == ""){
		document.getElementById("reqAddr1").className = "error";
		return false;

	}if(document.getElementById("reqAddr6").value == ""){
		document.getElementById("reqAddr6").className = "error";
		return false;

	}if(document.getElementById("reqAddrState").value == "0"){
		document.getElementById("reqAddrState").className = "error";
		return false;

	}if(document.getElementById("reqAddrPost").value == ""){
		document.getElementById("reqAddrPost").className = "error";
		return false;

	}if(document.getElementById("reqAddrPhone").value == ""){
		document.getElementById("reqAddrPhone").className = "error";
		return false;
		
	}if(document.getElementById("reqAddrEMail").value == ""){
		document.getElementById("reqAddrEMail").className = "error";
		return false;

	}else{
		return true;
	}
};

// Form Validation / New Account Template --------------------------------------------------------------------------------------------------------------------------

document.getElementById("formValidationAccount").onsubmit = function(){
	if(document.getElementById("AcctName").value == ""){
		document.getElementById("AcctName").className = "error";
		return false;

	}if(document.getElementById("AcctTitle").value == ""){
		document.getElementById("AcctTitle").className = "error";
		return false;

	}if(document.getElementById("AcctCompany").value == ""){
		document.getElementById("AcctCompany").className = "error";
		return false;

	}if(document.getElementById("AcctAddress1").value == ""){
		document.getElementById("AcctAddress1").className = "error";
		return false;

	}if(document.getElementById("AcctAddress2").value == ""){
		document.getElementById("AcctAddress2").className = "error";
		return false;

	}if(document.getElementById("AcctAddress6").value == ""){
		document.getElementById("AcctAddress6").className = "error";
		return false;

	}if(document.getElementById("AcctState").value == "0"){
		document.getElementById("AcctState").className = "error";
		return false;
		
	}if(document.getElementById("AcctPost").value == ""){
		document.getElementById("AcctPost").className = "error";
		return false;

	}if(document.getElementById("AcctCountry").value == ""){
		document.getElementById("AcctCountry").className = "error";
		return false;

	}if(document.getElementById("AcctPhone").value == ""){
		document.getElementById("AcctPhone").className = "error";
		return false;

	}if(document.getElementById("AcctLogin").value == ""){
		document.getElementById("AcctLogin").className = "error";
		return false;

	}if(document.getElementById("AcctLogin2").value == ""){
		document.getElementById("AcctLogin2").className = "error";
		return false;

	}if(document.getElementById("AcctPassword").value == ""){
		document.getElementById("AcctPassword").className = "error";
		return false;

	}if(document.getElementById("AcctPasswordDupe").value == ""){
		document.getElementById("AcctPasswordDupe").className = "error";
		return false;

	}else{
		return true;
	}
};

</script>

Schmotty

To clarify, you have two forms on the same page and only one works? Or forms on separate pages validated in same script? Which of the two is working when combined?

jcoder

I have two different forms on two different pages, one function is for one page and the other function is for the other. I wanted to combine the JS in a script.js doc. It seems that whichever function is on top is the one that works. Not sure what the problem is

Thanks

Schmotty

Have you tried making these named functions and then adding the onsubmit attribute to each form tag refrencing whichever function that form needs to call?

jcoder

Yeah this will work, but I was trying to get it to where I don't have to have any javascript in my HTML. My other websites are filled with this kind of stuff and I was trying to get it toned down.

Thanks

Schmotty

Well Your problem here might be that when the page loads, it reads the script. If it can't find an element by the name in the first function then an error would result. Have you checked your browser for error messages? I bet it can't find the onsubmit attribute of a 'null' object. And so it never gets to the second function. There for which ever function is on top will work on the right page, but neither will work on the wrong page.

If this is the case, you could try resolving this with an if statement to check it whether that element even exists before creating the function.

treehouse : what would you like to learn today?

Forums

Please Help! Only one Anonymous Functions works at a time.