Simple basic details form with validation....
<html>
<head>
<title> BasicDetails</title>
<script type='text/javascript'>
function val()
{
var c=0;
var firstname = document.getElementById("firstname").value;
var lastname = document.getElementById("lastname").value;
var ea = document.getElementById("ea").value;
if(isAlphanumeric(firstname))
{
c++;
}
else
{
alert("enter alphanumeric for firstname");
}
if(isAlphanumeric(lastname))
{
c++;
}
else
{
alert("enter alphanumeric for lastname");
}
if(isValue(ea))
{
c++;
}
else
{
alert("enter alphanumeric for email-address");
}
if(c==7)
alert("all fields are filled");
}
function isAlphanumeric(x)
{
var key= /^[0-9a-zA-Z]+$/;
if(x.match(key))
{
return true;
}
else
{
return false;
}
}
function isValue(x)
{
var key= /^[a-zA-Z0-9-\.\-]+\@[a-zA-Z]+\.[a-zA-Z]{3}+$/;
if(x.match(key))
{
return true;
}
else
{
return false;
}
}
</script>
</head>
<body>
<form action="" method="GET">
<table width="451" height="110" border="0" align="center">
<tr>
<td colspan="2">BASIC DETAILS</td>
</tr>
<tr>
<td>
'First Name:</td><td><input type='text' id='firstname'/></td></tr><BR>
<tr>
<td>
'Last Name:</td><td><input type='text' id='lastname'/></td></tr><BR>
<tr>
<td>
Company Name:</td><td><input type='text' id='companyname'/></td></tr><BR>
<tr>
<td>
Company/Personal<BR>Website:</td><td><input type='text' id='company'/></td></tr><BR>
<tr>
<td>
'Email:</td><td><input type='text' id='ea'/></td></tr><BR>
<tr>
<td>
Phone:</td><td><input type='text' id='phone'/>
Exit:</td><td><input type='text' id='exit'/></td></tr><BR>
<tr>
<td>
State/Province:</td><td><select name:'state' id='state'>
<option value="select for USA or Canada Only">Select for USA or Canada Only</option>
</select></td></tr><BR>
<tr>
<td>
'Country:</td><td><select name:'country' id='country'>
<option value="United States">United States</option>
</select></td></tr><BR>
<tr>
<td>
Comments:</td><td><textarea name='comments' id='comments'>
</textarea></td></tr><BR>
<tr>
<td colspan="2" align="center">
<input type="submit" value="Request" onClick="val()"/>
</td>
</tr>
</table>
</form>
</body>
</html>
OUTPUT:
No comments:
Post a Comment