AJAX - The responseText property

The responseText property is used to retrieve the data sent from the server.

In our case we want the place the data received from the server into the time textbox.

xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
  {
  document.myAJAXForm.time.value=xmlhttp.responseText;
  }
}

Also we need to change our HTML page code so that whenever there is any change in ‘name’ textbox setupAJAX() function is executed as shown below.

<form name="myAJAXForm">
Name: <input type="text" name="name" onkeyup="setupAJAX();" />
Current Date: <input type="text" name="time" />
</form>

So now the complete code of HTML page myAJAX.html will be –

<html>
<body>

<script type="text/javascript">
function setupAJAX()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {
  // code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
else
  {
  alert("Sorry, your browser seems to not support XMLHTTP functionality!");
  }
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
  {
  document.myAJAXForm.time.value=xmlhttp.responseText;
  }
}
xmlhttp.open("GET","date.php",true);
xmlhttp.send(null);
}
</script>

<form name="myAJAXForm">
Name: <input type="text" name="name" onkeyup="setupAJAX();" />
Current Date: <input type="text" name="time" />
</form>

</body>
</html>
 

http://www.botskool.com/programming-tutorials/ajax-tutorials/ajax-basic-tutorial