Guide to Using XMLHttpRequest (with Baby Steps)

The XMLHttpRequest object is a handy dandy JavaScript object that offers a convenient way for webpages to get information from servers without refreshing themselves.

The benefit to end users is that they don't have to type as much and they don't have to wait as long. For example, having the user's city and state show up in a webpage automatically after the ZIP code has been typed in is a big time saver.

Although the XMLHttpRequest object might sound complex and different from any other JavaScript object you have ever used, it really isn't. A good way to think of the XMLHttpRequest object is as you would think of the JavaScript Image object. As we know, with the Image object you can dynamically specify a new URL for the image source without reloading the page. Similarly with the XMLHttpRequest object, you can dynamically specify a URL to get some server data without reloading the page.

The purpose of this article is to demonstrate through a series of baby steps just how easy it is to use the XMLHttpRequest object.

In order to complete this tutorial you should have some basic PHP, MySQL and JavaScript experience. That said, the PHP programming in these examples is so basic that if you do not have PHP experience, it may still be possible for you to look at the PHP code and apply the functionality to your weapon of choice, be it PERL, ASP, or JSP.

* Written by Bill Bercik.