## JS ##
var request;

function createRequest() {
  try {
    request = new XMLHttpRequest();
  } catch (trymicrosoft) {
    try {
      request = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (othermicrosoft) {
      try {
        request = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (failed) {
        request = false;
      }
    }
  }

  if (!request)
    alert("Error initializing XMLHttpRequest!");
}

function doit() {
	new createRequest();
     var data = document.getElementById("data").value;
     var url = "php.php?data=" + escape(data);
     request.open("GET", url, true);
     request.onreadystatechange = updatePage();
     request.send(null);
}

function updatePage() {
	if (request.readyState == 4) {
       if (request.status == 200) {
		document.getElementByID('loading').style.display = 'none';
		document.getElementById("results").innerHTML = request.responseText;
	} else {
		document.getElementByID('loading').style.display = 'block';
		document.getElementByID('results').style.display = 'none';
	}
	}
}


## HTML ##

<div id="loading" style="display: none;">
Loading
</div>

<div id="results">
</div>
<form>
 <p>Data: <input type="text" name="data" id="data" size="25" /></p>
<p><input type="submit" value="Yap" id="yap" size="5" onclick="doit();" /></p>
</form>