Ajax Demos

Several demos of Ajax and the XMLHttpRequest object. Each demo is a HTML page, that holds
the JavaScript code and the HTML form used to interact with the script.
All the demos use an external JavaScript file, ajax.js that creates an instance of the object, and
assigns it to the xhr variable.
You are free to use the code of these demos as template for pages of your own website (see
licence at bottom).

Get a file

Read a text file from the server and display the content on the current page.
This is a minimal script that makes use of the GET method and checks only for the value of
readyState, and not the status.
This very simple code can work locally on a desktop.

Values of readyState

This property holds successive values of the readyState property, starting from 1, and ending to 4
when the exchange with the server is completed. This demo displays the values and helps to
understand how the XMLHttpRequest object works.

File exists

Simple demo to check if a file exists.

Form and XML

Fill a form with data taken from an XML document.

Reading an HTML page

This demo creates the responseHTML-like attribute, as the responseText and responseXML
attributes of XMLHttpRequest. It is made of a JavaScript function and a tag. To add this new
feature to a web page, copy the three lines of code from the demo file, and past them into the
page that has to read the content of another HTML page.
Works remotely or locally, and with any browser.

Scaling images under the mouse

Script to show how to manage a gallery of thumbnails with a function to display image in full
size, when the mouse is moved over a thumbnail.
Ajax is used for loading the full size images asynchronously after the loading of the page.

Sequence of requests
Vous can have a dialogue with a program on the server, by chaining Ajax requests, with the
POST method to send data to the server and GET to retrieve the results found by the remote
program. The demo shows how to overcome the traps of the asynchronous mode.