Friday, 13 March 2015

Javascript validation for registration form

Program:


<html>
<head>
<title>Registration form</title>
<script language="javascript">
function validate()
{
   var name=document.forms[0].elements[0].value;
   var pwd=document.forms[0].elements[1].value;
   var email=document.forms[0].elements[2].value;
   var phno=document.forms[0].elements[3].value;
   

  name_re=new RegExp("^[A-Za-z][a-zA-Z ]+$","g");
    pwd_re=new RegExp("^[0-9a-zA-Z]+$","g");
    email_re=new RegExp("^[a-zA-Z][\\w_.]+[@][\\w]+[.][com]+$","g");
    phno_re=new RegExp("^[\\d]+","g");
 
   if(!name.match(name_re))
     {
        alert(" name contains only alphabets only");
        document.forms[0].elements[0].select();

    }
    if(name.length<6)
    {
      alert("name should contain atleast 6 characters");
      document.forms[0].elements[0].select();
      }

    if(!pwd.match(pwd_re))
     {
        alert(" password should contain alphanumerics only");
        document.forms[0].elements[1].select();

    }
    if(pwd.length<6)
    {
      alert("password should contain atleast 6 characters");
      document.forms[0].elements[1].select();
      }

    if(!email.match(email_re))
     {
        alert(" invalid email");
        document.forms[0].elements[2].select();

    }
   
    if(!phno.match(phno_re))
     {
        alert(" invalid phone number");
        document.forms[0].elements[3].select();

    }
    if(phno.length<10)
    {
      alert("phone number should contain 10 digits ");
      document.forms[0].elements[3].select();
      }
   

  }
</script>
</head>
<body bgcolor="#abcdef">
<h3 align="center">Registration Form</h3>
<form name="reg_form" method="post">
NAME
<input type="text" name="uname" value="" size="15" maxlength="20"><br>
PASSWORD
<input type="password" name="pwd" value="" size="25"><br>
EMAIL
<input type="text" name="email" value="" size="15"><br>
PHONE NUMBER
<input type="text" name="phno" value="" size="15" maxlength="10"><br>
<pre>
GENDER
    male    <input type="radio" name="gender" value="male">
    female  <input type="radio" name="gender" value="female">
</pre>
<br>
DATE OF BIRTH &nbsp;&nbsp;
<select name="day">
<option selected>day</option>
<option >1</option>
<option >2</option>
<option >3</option>
</select>
&nbsp;

<select name="month">
<option selected>month</option>
<option >jan</option>
<option >feb</option>
<option >mar</option>
</select>
&nbsp;
<select name="year">
<option selected>year</option>
<option >1980</option>
<option >1981</option>
<option >1982</option>
</select>
<br>
<br>
<pre>
LANGUAGES KNOWN
   ENGLISH   <input type="checkbox" name="eng" >
   TELUGU    <input type="checkbox" name="tel" >
   HINDI     <input type="checkbox" name="hin" >
 </pre>
 ADDRESS <br>
 <textarea name="address" rows="3" cols="30">
enter your address here
</textarea>
<br><br>
<input type="button" name="sumbmit" value="submit" onClick="validate()">
<input type="reset" name="reset" value="clear">
</form>
</body>
</html>

No comments:

Post a Comment