Some common examples of AJAX include Google's auto-complete responses in the search field. As soon as you start typing in the search field, you see responses in real time, without any page refreshes.
Another example of AJAX is Google Maps. As you drag the screen in new areas, new map content loads from the server dynamically.
The infinite scrolling in Gmail and Google Reader also use AJAX functionality. As you scroll down, calls are made in the background to load new content from the server. The new content loads dynamically, without requiring page refreshes.
Two Components of an AJAX Call
AJAX uses a new object to make the calls:
XMLHttpRequest. However, unlike other functions, AJAX splits the call and response into two separate steps. This division of steps with the call and response allows for the asynchronous element of AJAX.
The XMLHttpRequest Object
The first step is to create a new
XMLHttpRequest object. Because of some cross-browser incompatibility in calling the
XMLHttpRequest object, you have to create a conditional statement to account for Internet Explorer. With this conditional statement in mind, you create the new object as follows:
This above code doesn't specify exactly where on the server the request is being made. However, before you specify more details about the request, you have to specify how to handle the response that will come back from the server.
To handle this response, you use the
Now that you've defined how to handle the responses from the server, you can write a more specific request to send. The specific request might look as follows:
AJAX calls are more advanced and would contain more detail, but this is the basic pattern of the call.
About Tom Johnson
I'm an API technical writer based in the Seattle area. On this blog, I write about topics related to technical writing and communication — such as software documentation, API documentation, AI, information architecture, content strategy, writing processes, plain language, tech comm careers, and more. Check out my API documentation course if you're looking for more info about documenting APIs. Or see my posts on AI and AI course section for more on the latest in AI and tech comm.
If you're a technical writer and want to keep on top of the latest trends in the tech comm, be sure to subscribe to email updates below. You can also learn more about me or contact me. Finally, note that the opinions I express on my blog are my own points of view, not that of my employer.