I have the following JavaScript code which validates a login form, and submits if it is valid. the code works on chrome and IE.
But on Firefox it doesn't show error feedback on passwordinfo and usernameinfo (document.getElementById("passwordinfo").innerText = "please enter password";)
Please help me find the problem as I am going to add ajax, and it is scaring me.
<!DOCTYPE html>
<html>
<head>
<link href="mystyle.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<title>welcome</title>
<script type="text/javascript">
function isvalidmail(mail) {
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
return filter.test(mail);
}
function checklogin() {
var email = document.getElementById("username").value;
var password = document.getElementById("password").value;
if(email.length < 1 || email.length > 30||(!isvalidmail(email)))
document.getElementById("usernameinfo").innerText = "please enter valid email";
else {
document.getElementById("usernameinfo").innerText = "";
if(password.length === 0)
document.getElementById("passwordinfo").innerText = "please enter password";
else {
document.getElementById("passwordinfo").innerText = "";
document.forms["login"].submit();
}
}
}
</script>
</head>
<body onload="checkCookies()">
<script>
function checkCookies(){
if (!navigator.cookieEnabled==true){
document.write("You need to enable cookies to make the site work properly.<br>Please enable cookies and <a href='index.php'>Reload</a>");
}
}
</script>
<div id="container">
<div id="headerpart">
<?php include "module_header.php" ?>
</div>
<div id="bodypart">
<div id="nav">
<?php
include 'navigation_bar.php';
?>
</div>
<div id="mainop">
<span id="sessionexp"><?php if(isset($_GET["redirect"]))if($_GET["redirect"]=='session') echo "Your Session has Expired please login"; ?></span>
<form id="login" action="checklogin.php" method="POST" align="center">
<table border="0" bgcolor="#FFFFCB" align="center"><br/>
<thead>please login below</thead>
<tr>
<td>email:</td>
<td><input type="text" id="username" name="username" /></td>
<td>
<span class="warning" id="usernameinfo" name="usernameinfo">
<?php
if(isset($_GET["errno"]) && $_GET["errno"] == 1)
echo "wrong username."
?>
</span>
</td>
</tr>
<tr>
<td>password:</td>
<td><input type="password" id="password" name="password" /></td>
<td>
<span class="warning" id="passwordinfo" name="passwordinfo">
<?php
if(isset($_GET["errno"]) && $_GET["errno"] == 2)
echo "wrong password.";
?>
</span>
</td>
</tr>
</table>
<br />
<input type="button" value="Login" onclick="checklogin()"/>
<?php echo " New User? <a href=\"register.php\"><b>Register freely!</b></a>"; ?>
</form>
</div>
</div>
</div>
</body>
</html>
