Hello,
I have a problem with my form validator. For some reason it will always return true when it should return false and display and error message (either about a blank username or password).
Here is my javascript:
<script type='text/javascript'>
function ValidateLogin(form)
{
var error=false;
document.getElementById('userError').style.display = 'none';
document.getElementById('passError').style.display = 'none';
document.getElementById('invalidError').style.display = 'none';
document.getElementById('usedError').style.display = 'none';
document.getElementById('loading').style.display = 'block';
document.getElementById('submit').style.display = 'none';
with(form)
{
if(pass.value==''||pass.value==null)
{
document.getElementById('passError').style.display = 'block';
error=true;
pass.focus();
}
if(user.value==''||user.value==null)
{
document.getElementById('userError').style.display = 'block';
error=true;
user.focus();
}
if(error==true)
{
document.getElementById('loading').style.display = 'none';
document.getElementById('submit').style.display = 'block';
return(false);
}
else
{
return(true);
}
}
}
</script>And here is my HTML (JavaScript Included):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>TSS SGA Voting System - Login</title>
<style type="text/css">
body {
font: Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: medium;
color: #FFFFFF;
margin: 0 0 0 0;
padding: 0 0 0 0;
}
a, a:visited {
color: #FFCC00;
text-decoration: none;
}
a:hover {
color: #FFFF00;
text-decoration: underline;
}
#box #content #loading {
display: none;
}
#box #content #userError, #box #content #passError, #box #content #invalidError, #box #content #usedError {
display: none;
color: #FF0000;
font-size: 14px;
}
#box #content #mError, #box #content #sError, #box #content #tError {
display: none;
color: #FF0000;
font-size: 14px;
}
</style>
<script type='text/javascript'>
function ValidateLogin(form)
{
var error=false;
document.getElementById('userError').style.display = 'none';
document.getElementById('passError').style.display = 'none';
document.getElementById('invalidError').style.display = 'none';
document.getElementById('usedError').style.display = 'none';
document.getElementById('loading').style.display = 'block';
document.getElementById('submit').style.display = 'none';
with(form)
{
if(pass.value==''||pass.value==null)
{
document.getElementById('passError').style.display = 'block';
error=true;
pass.focus();
}
if(user.value==''||user.value==null)
{
document.getElementById('userError').style.display = 'block';
error=true;
user.focus();
}
if(error==true)
{
document.getElementById('loading').style.display = 'none';
document.getElementById('submit').style.display = 'block';
return(false);
}
else
{
return(true);
}
}
}
</script>
</head>
<body>
<div align="center">
<table width="500" border="0" cellpadding="0" cellspacing="0" id="box">
<tr height="30"><td width="30"></td><td id="title">Login</td><td width="30"></td></tr>
<tr><td colspan="3" id="content">
<table align='center' border='0' cellpadding='0' cellspacing='0' id='usedError' style='background:#FFCC00;border:#FFFF00 1px solid; width: 75%; color:#000000; font-size:medium; margin-top: 5px;'><tr><td width='15' bgcolor='#FFFF00'></td><td style='padding-left: 10px;'>Please Enter Your Username</td></tr></table>
<table align='center' border='0' cellpadding='0' cellspacing='0' id='passError' style='background:#FFCC00;border:#FFFF00 1px solid; width: 75%; color:#000000; font-size:medium; margin-top: 5px;'><tr><td width='15' bgcolor='#FFFF00'></td><td style='padding-left: 10px;'>Please Enter Your Password</td></tr></table>
<form name='login' action='system.php' method='post' onsubmit='return ValidateLogin(this);'>
<table border='0' align='center'>
<tr><td align='right'>Username:</td><td align='left'><input type='text' name='user' /></td></tr>
<tr><td align='right'>Password:</td><td align='left'><input type='password' name='pass' /></td></tr>
<tr><td colspan='2' align='center'><input type='submit' value='Login' id='submit' /></td></tr>
</table>
</form>
<div id='loading'><img src='images/loader.gif' /> Loading...</div>
</td></tr>
<tr height="30"><td width="30"></td><td id="footer"></td><td width="30"></td></tr>
</table>
</div>
</body>
</html>If you notice I have removed some sensitive information and some non-relevant (such as images) tags from the HTML. If you know the problem please help me!!! Thanks so much!!!
