Log in

View Full Version : Resolved Why is this not working??


lschena
08-23-2011, 07:49 PM
This is some code I got to make a form with if and else statements. It isn't working correctly-if I do not fill out the field, i get the correct alert but when that alert box ok button is pressed, I go immediately to the success page-even though the form did not get the correct info filled in.

Or, if the the email field is missing the @ or "." it still brings me to the success! page.

I need to figure this out urgently-can anyone help?? Thanks a million if you can!!




<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">

function validateEmail()
{

var emailID = document.myForm.EMail.value;
atpos = emailID.indexOf("@");
dotpos = emailID.lastIndexOf(".");
if (atpos < 1 || ( dotpos - atpos < 2 ))
{
alert("Please enter correct email ID")
document.myForm.EMail.focus() ;
return false;
}
return( true );
}

function validate()
{
if( document.myForm.FullName.value == "" )
{
alert( "Please provide your full name!" );
document.myForm.Name.focus() ;
return false;
}
if( document.myForm.EMail.value == "" )
{
alert( "Please provide your Email!" );
document.myForm.EMail.focus() ;
return false;
}
if( document.myForm.Zip.value == "" ||
isNaN( document.myForm.Zip.value ) ||
document.myForm.Zip.value.length != 5 )
{
alert( "Please provide a zip in the format #####." );
document.myForm.Zip.focus() ;
return false;
}
if( document.myForm.State.value == "-1" )
{
alert( "Please provide your State!" );
return false;
}
return( true );
}
//-->
</script>
</head>
<body>
<form action="success.html" name="myForm" onsubmit="return(validate());">
<table cellspacing="2" cellpadding="2" border="1">
<tr>
<td align="right">Full Name</td>
<td><input type="text" name="FullName" /></td>
</tr>
<tr>
<td align="right">EMail</td>
<td><input type="text" name="EMail" /></td>
</tr>
<tr>
<td align="right">Zip Code</td>
<td><input type="text" name="Zip" /></td>
</tr>
<tr>
<td align="right">State</td>
<td>
<select name="Country">
<option value="-1" selected>[choose yours]</option>
<option value="1">CT</option>
<option value="2">MA</option>
<option value="3">NH</option>
</select>
</td>
</tr>
<tr>
<td align="right"></td>
<td><input type="submit" value="Submit" /></td>
</tr>
</table>
</form>
</body>
</html>
XManBG
08-23-2011, 11:16 PM
Hi,

primary: it's just the naming :p !! In your function validate(), change Name into FullName (as the input) and State into Country (as the input again).... or just vica versa... and voila :) This is working.

And about the eMail checking. Good you have the second function validateEmail(), but you're not calling it. Just add following line after your second if... in the validate():


if (!validateEmail())return false;

Cheers

P.S. And here for you the whole working program again:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<head>
<title>Form Validation</title>

<script type="text/javascript">

function validateEmail(){
var emailID = document.myForm.EMail.value;
atpos = emailID.indexOf("@");
dotpos = emailID.lastIndexOf(".");
if (atpos < 1 || ( dotpos - atpos < 2 )){
alert("Please enter correct email ID");
document.myForm.EMail.focus();
return false;
}
return true;
};

function validate(){
if ( document.myForm.FullName.value == "" ){
alert( "Please provide your full name!" );
document.myForm.FullName.focus() ;
return false;
};
if ( document.myForm.EMail.value == "" ){
alert( "Please provide your Email!" );
document.myForm.EMail.focus() ;
return false;
};
if (!validateEmail())return false;
if ( document.myForm.Zip.value == "" || isNaN( document.myForm.Zip.value ) || document.myForm.Zip.value.length != 5 ){
alert( "Please provide a zip in the format #####." );
document.myForm.Zip.focus() ;
return false;
};
if ( document.myForm.Country.value == "-1" ){
alert( "Please provide your State!" );
return false;
};
return true;

};

</script>
</head>

<body>
<form action="success.html" name="myForm" onsubmit="return validate();">
<table cellspacing="2" cellpadding="2" border="1">
<tr>
<td align="right">Full Name</td>
<td><input type="text" name="FullName" /></td>
</tr>
<tr>
<td align="right">EMail</td>
<td><input type="text" name="EMail" /></td>
</tr>
<tr>
<td align="right">Zip Code</td>
<td><input type="text" name="Zip" /></td>
</tr>
<tr>
<td align="right">State</td>
<td>
<select name="Country">
<option value="-1" selected>[choose yours]</option>
<option value="1">CT</option>
<option value="2">MA</option>
<option value="3">NH</option>
</select>
</td>
</tr>
<tr>
<td align="right"></td>
<td><input type="submit" value="Submit" /></td>
</tr>
</table>
</form>
</body>

</html>
lschena
08-24-2011, 01:47 AM
Oh Gosh, I envy that you just can just so easily what is wrong. It absolutely works! This is tough to learn but I am getting there. Thanks for the help!!