<html>
<head>
<title>JavaScript Form Validation</title>
<script type="text/javascript" language="javascript">
var uname, fname;
function setRef()
{
uname=document.getElementById("txtuname");
//pass=document.getElementById("txtpass");
//cpass=document.getElementById("txtcpass");
fname=document.getElementById("txtfname");
/*lname=document.getElementById("txtlname");
male=document.getElementById("male");
female=document.getElementById("female");
reading=document.getElementById("reading");
writing=document.getElementById("writing");
playing=document.getElementById("playing");
day=document.getElementById("cmbday");
month=document.getElementById("cmbmonth");
mobile=document.getElementById("txtmobile");
email=document.getElementById("txtemail");
address=document.getElementById("taaddress");*/
}
function isValid()
{
setRef();
if(isEmpty(uname,"Username is necessary"))
{
if(isAlpha(fname,"Name must be in letters"))
{
return true;
}
}
else
{
return false;
}
}
function isEmpty(ctrid,errmsg)
{
if(ctrid.value.length==0)
{
alert(errmsg);
ctrid.focus();
return false;
}
else
{
return true;
}
}
function isAlpha(ctrid,errmsg)
{
var str=/^[a-zA-Z]+$/;
if(ctrid.value.match(str))
{
return true;
}
else
{
alert(errmsg);
ctrid.focus();
return false;
}
}
</script>
</head>
<body>
<form name="form1" method="post" action="FormProcess.php">
<table width="50%" border="0" align="center">
<tr>
<th><div align="right">Username:</div></th>
<td><input name="txtuname" type="text" id="txtuname" size="30"></td>
</tr>
<tr>
<th><div align="right">Password:</div></th>
<td><input name="txtpass" type="password" id="txtpass" size="30"></td>
</tr>
<tr>
<th><div align="right">Confirm Password:</div></th>
<td><input name="txtcpass" type="password" id="txtcpass" size="30"></td>
</tr>
<tr>
<th><div align="right">FirstName:</div></th>
<td><input name="txtfname" type="text" id="txtfname" size="30"></td>
</tr>
<tr>
<th><div align="right">LastName:</div></th>
<td><input name="txtlname" type="text" id="txtlname" size="30"></td>
</tr>
<tr>
<th><div align="right">Gender:</div></th>
<td><input name="gender" id="male" type="radio" value="Male">Male<br>
<input name="gender" id="female" type="radio" value="Female">Female</td>
</tr>
<tr>
<th><div align="right">Hobbies:</div></th>
<td><input type="checkbox" name="chk[]" id="reading" value="Reading">Reading<br>
<input type="checkbox" name="chk[]" id="writing" value="Writing">Writing<br>
<input type="checkbox" name="chk[]" id="playing" value="Playing">Playing</td>
</tr>
<tr>
<th><div align="right">DOB:</div></th>
<td><select name="cmbday" id="cmbday">
<option value="Day">Day</option>
<script type="text/javascript" language="javascript">
for(var i=1;i<=31;i++)
{
document.write("<option value='i'>"+i+"</option>");
}
</script>
</select>
<select name="cmbmonth" id="cmbmonth">
<option value="Month">Month</option>
<script type="text/javascript" language="javascript">
for(var i=1;i<=12;i++)
{
document.write("<option value='i'>"+i+"</option>");
}
</script>
</select>
<select name="cmbyear" id="cmbyear">
<option value="Year">Year</option>
<script type="text/javascript" language="javascript">
for(var i=2000;i>=1950;i--)
{
document.write("<option value='i'>"+i+"</option>");
}
</script>
</select></td>
</tr>
<tr>
<th><div align="right">Mobile No:</div></th>
<td><input name="txtmobile" type="text" id="txtmobile" size="30"></td>
</tr>
<tr>
<th><div align="right">Email ID:</div></th>
<td><input name="txtemail" type="text" id="txtemail" size="30"></td>
</tr>
<tr>
<th><div align="right">Address:</div></th>
<td><textarea name="taaddress" id="taaddress" cols="25" rows="10"></textarea></td>
</tr>
<tr>
<th colspan="2"><div align="center">
<input type="submit" name="Submit" value="Register" onClick="return isValid()">
</div></th>
</tr>
</table>
</form>
</body>
</html>
One more thing how can i check multiple fileds for non-empty requirements.


Sign In
Create Account


Back to top









