This is a new type of example of email validation, where we want to validate a form through ajax, The display page contains three fields first one is the name field, second one is the email address field and the last is for the city, this example is for validate the email address, when a user fills his name and then his email id and as he go to fill the city the email validation checks whether the email filled by the user is valid or invalid, a message appers identifying the valid/ invalid email.
Page name: validation.php
<html>
<head>
<script type=”text/javascript”>
function validate(email)
{
var httpxml;
try
{
// Firefox, Opera 8.0+, Safari
httpxml=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
httpxml=new ActiveXObject(“Msxml2.XMLHTTP”);
}
catch (e)
{
try
{
httpxml=new ActiveXObject(“Microsoft.XMLHTTP”);
}
catch (e)
{
alert(“Your browser does not support AJAX!”);
return false;
}
}
}
function stateck()
{
if(httpxml.readyState==4)
{
document.getElementById(“displayMsg”)
.innerHTML=httpxml.responseText;
}
}
var url=”getdata.php”;
url=url+”?email=”+email;
url=url+”&sid=”+Math.random();
httpxml.onreadystatechange=stateck;
httpxml.open(“GET”,url,true);
httpxml.send(null);
}
</script>
</head>
<form name=f1 action=”>
<table border=”1″ cellpadding=”2″ c
ellspacing=”2″ vspace=”80″ align=”center” width=”50%”>
<tr>
<td align=”right”> Name:</td>
<td align=”left”><input type=text name=n1></td>
</tr>
<tr>
<td align=”right”>email address:</td>
<td align=”left” height=”40″><input type=text name=email
onBlur=”validate(this.value);”><div id=”displayMsg”></div></td>
</tr>
<tr>
<td align=”right”>City:</td>
<td align=”left”><input type=”text” name=”city”></td>
</tr>
<tr>
<td colspan=”2″ align=”center”><input type=”submit” v
alue=”Submit” ><input type=”hidden” value=”test” name=”todo”></td>
</tr>
</table>
</form>
</html>
Page Name: getdata.php <?php
$email=$_GET[’email’];
echo $email;
if (!eregi(“^[_a-z0-9-]+(.[_a-z0-9-]+)
*@[a-z0-9-]+(.[a-z0-9-]+)*(.[a-z]{2,3})$”, $email))
{
echo “<font color=red> Invalid email</font>”;
}else{
echo “<font color=green> Valid Email</font>”;
}
?>
Explanation: This is simple a form validation script through ajax, in which the html page having the html script and the java script and the php script is written in getdata.php page the concept of the script is so simple, the user enter its details and its email id and it is validating through php page which have the validation script. The code written in the validate.php have the same meaning as in the above code as explained in the above example.