Email validation Using Ajax & PHP

You can see how email validation is done by using regular expression in PHP. We will further extend this validation by using PHP & Ajax. As you know for validation purpose we will be using the same PHP code so it is better you try to understand the PHP code by reading the email validation tutorial. We will discuss the Ajax part here only.

Ajax code uses the asynchronous JavaScript and XML , the detail how AJAX works is not explained here. We will focus only on email validation part here.

Usually within a form email field is required along with some other fields like name, address etc so we have kept here two other fields name and city name along with email entry field. While filling the data we will first fill name and then email and then city name. When we finish entering the email address we will exit the email address to next field, at that time the validation code written in PHP of email will be executed. So we have used onBlur event handler of email field to trigger the validation code using Ajax. Read this code line.

As you have seen we have passed the email data as entered by user to the Ajax function and then through XMLHttpRequest we will pass this email data to our php code kept at server inside a PHP file. The validation code in PHP is same as our email validation code. The output of this validation is displayed at the form here. See the demo bellow.

Demo of Email validation with Ajax

Here is the code of this validation written in this page, you can see the source of this page to get this same script.

<script type="text/javascript">
function AjaxFunction(email)
var httpxml;
// Firefox, Opera 8.0+, Safari
httpxml=new XMLHttpRequest();
catch (e)
// Internet Explorer
httpxml=new ActiveXObject("Msxml2.XMLHTTP");
catch (e)
httpxml=new ActiveXObject("Microsoft.XMLHTTP");
catch (e)
alert("Your browser does not support AJAX!");
return false;
function stateck()
var url="email-ajax.php";

The HTML code to display the form ( as in the above demo ) is here

<form name=f1 action=''>
Your First Name <input type=text name=n1><br>
Any email address <input type=text name=email onBlur="AjaxFunction(this.value);">
<div id="msg"></div>
Your City Name <input type=text name=city>
<input type=submit value=Submit >
<input type=hidden value=test name=todo>

Now the code kept within email-ajax.php file is here, this is same code as explained at email validation tutorial

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>";
echo "<font color=green> Valid Email</font>";}

The above code in email-ajax.php file can be replaced by this code if you are using email filter function .

echo " Correct email "; }
else{ echo " Wrong email address "; }

Be the first to post comment on this article :


Post Comment This is for short comments only. Use the forum for more discussions.


How you handle Search Engine Optimization ( SEO ) for your website
HTML . MySQL. PHP. JavaScript. ASP. Photoshop. Articles. FORUM Contact us
©2000-2015 All rights reserved worldwide Privacy Policy Disclaimer