Home >>Ajax Tutorial >Ajax Registration Form

Ajax Registration Form

Registration Form Using Ajax


<html>
<head>
<script>

function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}

}

var name=document.getElementById("n").value;
var eid=document.getElementById("eid").value;
var mob=document.getElementById("mob").value;

xmlhttp.open("GET","demo_get.php?n="+name+"&eid="+eid+"&mob="+mob,true);
//xmlhttp.open("GET","demo_get.php?fname=Henry&lname=Ford",true);

xmlhttp.send();
}
</script>
</head>

<body>
<h2>AJAX EXAMPLE</h2>
Enter your name<input type="text" id="n"/><hr/>
Enter your email<input type="text" id="eid"/><hr/>
Enter your mobile<input type="text" id="mob"/><hr/>
<input type="button" value="Show Name"  onClick="loadXMLDoc()"/><hr/>
<div id="myDiv" style="color:#993300;text-align:center;width:200px;border:1px solid #F8F8F8"></div>

</body>
</html>

PHP Script to display data retrieved through Ajax


<?php
echo "welcome ".$_GET['n']."
"; echo "Your email is ".$_GET['eid']."
"; echo "your mobile is ".$_GET['mob']."
"; //echo "welcome ".$_GET['m']."
"; ?>

Popular Tutorials