Friday, 18 October 2013

Login page with validation using HTML

<html>
<head>
<script>
function validate()
{
  var user=document.frmlogin.username.value;
  var invalid=/\W/; //Alphanumeric characters and Underscore permitted
  if(user==""){
   alert("Enter your username!");
   return false;
  }
if(invalid.test(user)){
  alert("Username contain Invalid characters!");
  return false;
}
if(user.length<6 || user.length>15){ //username must be 6 - 15 letters length
  alert("Username must be 6 - 15 characters length!");
  return false;
}
var pass=document.frmlogin.userpass.value;
invalid=/[\W_]/; //Alphabets and digits only allowed
if(pass==""){
  alert("Enter your password!");
  return false;
}
if(pass.length<6){
  alert("Password must contain atleast 6 letters!");
  return false;
}
if(invalid.test(pass)){
  alert("Password contain Inalid characters!");
  return false;
}
return true;      
}
</script>
</head>

<body background="{!$Resource.pic}" width="150" height="150">
<form name="frmlogin" method="post" action="#" onsubmit="return validate()">
<center>
Username: <input type="text" name="username" /> <br />
Password: <input type="password" name="userpass" />
<input type="submit"  name="login" value="Login" />
</center>
</form>
</body>
</html>

No comments:

Post a Comment