AJAX

Asynchronous JavaScript and XML

Instead of always downloading entire web pages, wouldn't it be nice if you only had to download the bit that changed.

Examples:

• OLD STYLE: streetmap or multimap - Whenever you scroll the map, an entire new web page downloads. Clang, clunk.
• AJAX SITE: maps.google.com - You can drag the map with the mouse without downloading a whole new page. Nice and smoother than a puppy!

The new AJAX style is achieved using the JavaScript function - XMLHttpRequest() and DOM, the Document Object Model. There is a JavaScript and DOM tutorial here and w3schools has guides for JavaScript, DOM and XML.

XMLHttpRequest() is available in all new browsers. I.E. requires the correct activex control to be available. Other browsers just work. This function sends a normal http request to a web server. The server replies with a snippet of code often in HTML or XML format. This is used to update one part of the loaded web page without having to reload the entire page.

This php code needs to be present in a file named "rpc.php". Use "View - Document Source" to see the JavaScript code used in this page.

<?php

switch($_REQUEST['action']) {
  case 'foo':
    /* do something */
    echo "foo|<h1>This was downloaded without having to<br>update the entire web page. Hah!</h1>";
    break;
}

?>