Ajax Demonstration
The demos below give live examples of the use of Ajax technology to carry out behnd-the-scenes conversations with the server, thereby avoiding the need to wait for page refresh. The demos operate on a server database containing fictitious 'Agents'. Try the examples in order.
Sortable Table
Sometimes known as a data grid. The grid below can be sorted by column using the up and down arrows.
Each time an arrow is clicked, another request is made of the server, and the data is returned by the server in the order requested.
Try changing the column sort orders. Note that the table is updated each time without the requirement for a page refresh.
Keen to learn more? I have a website dedicated entirely to Ajax, at CrackAjax.net, where you'll find more tutorials, example code and fully-worked projects
AgID  |
Agent Name  |
Salut  |
Office Telephone  |
Search/Suggest Popup
Below is an example of Ajax being used to interactively seek particular records and load them into a form. In this case, start to enter a telephone number from the above table, and watch the popup box query the database with each keystroke and offer records matching what you have so far entered. This is similar to the operation of Google's 'suggest' search interface, which also uses Ajax to chieve this behaviour.
When you see the record you want, click on it to load the whole record. This is carried out via another hidden call to the server. Again, no page refresh is required.
Now try amending the Name or Salutation of the loaded record, and click the button to save the changes. You should see the changes displayed immediately in the data grid. These changes have, once more, been sent to the server via a background XML call, with no need to refresh the page.
All of the information on this site is free to use (but without warranty). If you have found the site useful, you may care to donate a little to the upkeep of the site and the generation of future projects:
Some related resources:
NOTE ON BROWSERS:
When you're experimenting with Ajax applications, it's important to check that your programs work in all of the commonly-used browsers. It always surprises me that so many Windows users don't install other browsers - at the very least, Firefox - to try in addition to Internet explorer. It's free, has pop-up blocking, tabbed browsing, as well as privacy and security features, and a rapidly-exoanding user base. If you run Windows, you can install Firefox alongside IE and compare the results in both. Why not take a moment to get it now?