tags:

views:

61

answers:

2

My javascript is not working right. It is simple pre-vailidation form and I can not get the script to work. It is supposed to validate each field but I can not get it to validate past the first name. I stripped out all of the other garbage so the code would not be confusing Should be a copy paste to notepad. Little help please

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0         Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>


<script language="JavaScript" type="text/javascript">    
<!--    
function validateForm(theForm) {    
 var name = theForm.firstname.value;
 var name = theForm.lastname.value;     
 var email = theForm.email.value;    
 if (name == "") {    
   alert("Please fill in your First Name.");    
   theForm.firstname.focus();    
   return false;    
 }  
 if (name == "") {    
   alert("Please fill in your Last Name.");    
   theForm.lastname.focus();    
   return false;    
 }

 if (email == "") {    
   alert("Please fill in your email address.");    
   theForm.email.focus();    
   return false;    
 }    
 return true;    
}    
//--> 

</script>


if (!theForm.myCheckbox1.checked {    
 alert("Please check the honor box.");    
 return false;    
}


</head>
<body>
</script>    



<fieldset>
<legend>Fun in the Sun With JavaScript</legend>  
<ul>  


<form action="blah.cgi" method="post"    
     onSubmit="return validateForm(this);">    
First name: <input type="text" name="firstname"> <font color="#FF0000" size="1"     face="Arial, Helvetica, sans-serif"><strong>*</strong></font> <br><br> 
Last name: <input type="text" name="lastname"> <font color="#FF0000" size="1"     face="Arial, Helvetica, sans-serif"><strong>*</strong></font>  <br><br>
Email address: <input type="text" name="email"> <font color="#FF0000" size="1" face="Arial, Helvetica, sans-serif"><strong>*</strong></font>  <br><br>  
Phone Number: <input type="text" name="phone"><br><br>    
<input type="submit" name="submit" value="Submit">    
</form>   



<input type="checkbox" name="myCheckbox" value="someValue"><font color="#FF0000" size="1" face="Arial, Helvetica, sans-serif"><strong>*</strong></font> <P>By checking this Box you are confirming the data is accurate</p>


<p>(* indicates a required field)</p>





</body>
</html>
+3  A: 

You are declaring 2 variables named name, that might be the problem.

Change the variable name like the following:

var firstName = theForm.firstname.value;
var lastName = theForm.lastname.value;

Don't forget to update the rest of the code with these variable names

Edit:

You might also want to check on those return statements as you are terminating the flow to not reach the next block.

I also like @psuphish05 suggestion for this part

Mahesh Velaga
Yes... I thought that may be it as well. changed the var to var1 and var2 did not work. It has to be simple... But I am missing something easy I am sure.
Michael
Could u please update the question with your latest code? Thanks
Mahesh Velaga
Mahesh thank you so much... Your suggestion worked fine. I stripped this down so I could post on this site so I new there were some errors. Thanks again.
Michael
glad to help :)
Mahesh Velaga
A: 

On top of the other two answers provided above about declaring a variable with the same name you are also returning false if the validation fails in the if block. This will cause the method to exit prematurely prior to obtaining all the errors.

... return false; //Will cause premature exit }

You could maintain an isValid boolean variable in the method and return that at the end rather than in each if block. Just set to each isValid to false in the if block upon validation failure. This will allow you to go thru all your validation checks and display your alerts to the user if a field fails and provide a single point of exit for your method.

var isValid = true;

... isValid = false; //When validation fails.

return isValid; //At the end of your method.

Hope this provides some insight.

psuphish05
Thanks .. I see what you mean on the validation. I am new with JavaScript but I do understand what you are talking about.
Michael
No problem at all. Glad we could help.
psuphish05