- The Need for Ajax
- Introducing Ajax
- The Constituent Parts of Ajax
- Putting It All Together
- Summary
This chapter is from the book
This chapter is from the book
This chapter is from the book
The Constituent Parts of Ajax
Now let's examine the components of an Ajax application one at a time.
The XMLHTTPRequest Object
When you click on a hyperlink or submit an HTML form, you send an HTTP request to the server, which responds by serving to you a new or revised page. For your web application to work asynchronously, however, you must have a means to send HTTP requests to the server without an associated request to display a new page.
You can do so by means of the XMLHTTPRequest object. This JavaScript object is capable of making a connection to the server and issuing an HTTP request without the necessity of an associated page load.
In following chapters you will learn what objects are, see how an instance of this object can be created, and see how its properties and methods can be used by JavaScript routines included in the web page to establish asynchronous communications with the server.
Chapter 5, "Working with the Document Object Model" will introduce the concept of objects in general, and this subject will be expanded in Chapter 7 "Using Functions and Objects."
Chapter 10, "The Heart of Ajax"—the XMLHTPPRequest Object, discusses how to create an instance of the XMLHTTPRequest object and reviews the object's properties and methods.
Talking with the Server
In the traditional style of web page, when you issue a server request via a hyperlink or a form submission, the server accepts that request, carries out any required server-side processing, and subsequently serves to you a new page with content appropriate to the action you have undertaken.
While this processing takes place, the user interface is effectively frozen. You are made quite aware of this, when the server has completed its task, by the appearance in the browser of the new or revised page.
With asynchronous server requests, however, such communications occur in the background, and the completion of such a request does not necessarily coincide with a screen refresh or a new page being loaded. You must therefore make other arrangements to find out what progress the server has made in dealing with the request.
The XMLHTTPRequest object possesses a convenient property to report on the progress of the server request. You can examine this property using JavaScript routines to determine the point at which the server has completed its task and the results are available for use.
Your Ajax armory must therefore include a routine to monitor the status of a request and to act accordingly. We'll look at this in more detail in Chapter 11, "Talking with the Server."
What Happens at the Server?
So far as the server-side script is concerned, the communication from the XMLHTTPRequest object is just another HTTP request. Ajax applications care little about what languages or operating environments exist at the server; provided that the client-side Ajax layer receives a timely and correctly formatted HTTP response from the server, everything will work just fine.
It is possible to build simple Ajax applications with no server-side scripting at all, simply by having the XMLHTTPRequest object call a static server resource such as an XML or text file.
Ajax applications may make calls to various other server-side resources such as web services. Later in the book we'll look at some examples of calling web services using protocols such as SOAP and REST.
Dealing with the Server Response
Once notified that an asynchronous request has been successfully completed, you may then utilize the information returned by the server.
Ajax allows for this information to be returned in a number of formats, including ASCII text and XML data.
Depending on the nature of the application, you may then translate, display, or otherwise process this information within the current page.
We'll look into these issues in Chapter 12, "Using the Returned Data."
Other Housekeeping Tasks
An Ajax application will be required to carry out a number of other duties, too. Examples include detecting error conditions and handling them appropriately, and keeping the user informed about the status of submitted Ajax requests.
You will see various examples in later chapters.