|
|
Ajax GET method of form SubmissionWe will keep a standard code sample for using in our Ajax applications. This code sample is kept as simple as possible with minimum requirements for easy understanding. This script can be developed further to have more facilities and functionalities.
Here we have used GET method of form submission where data posted in a form is taken to a backend PHP script. The PHP script is only reply back the same data string by adding a Welcome message to this.
If you are new to Ajax then try to read our previous tutorials on basics of Ajax.
Click Here to See a demo of this GET method of Ajax form submission code
<html>
<body>
<script type="text/javascript">
function ajaxFunction(str)
{
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 stateChanged()
{
if(httpxml.readyState==4)
{
document.myForm.time.value=httpxml.responseText;
}
}
var url="time.php";
url=url+"?txt="+str;
url=url+"&sid="+Math.random();
httpxml.onreadystatechange=stateChanged;
httpxml.open("GET",url,true);
httpxml.send(null);
}
</script>
<form name="myForm">
Name: <input type="text"
onkeyup="ajaxFunction(this.value);" name="username" />
Time: <input type="text" name="time" />
</form>
</body>
</html>
|
| |
|
|
|
|
|
