Putting It All Together
Suppose that you want to design a new Ajax application, or update a legacy web application to include Ajax techniques. How do you go about it?
First you need to decide what page events and user actions will be responsible for causing the sending of an asynchronous HTTP request. You may decide, for example, that the action of moving the mouse cursor over an image will result in a request being sent to the server to retrieve further information about the subject of the picture, or that the clicking of a button will generate a server request for information with which to populate the fields on a form.
Having made the request, you need to write routines to monitor the progress of that request until you hear from the server that the request has been successfully completed.
Finally, after receiving notification that the server has completed its task, you need a routine to retrieve the information returned from the server and apply it in the application. You may, for example, want to use the newly returned data to change the contents of the page's body text, populate the fields of a form, or pop open an information window.
Figure 3.5 shows the flow diagram of all this.
Figure 3.5 How the components of an Ajax application work together.
In Chapter 13, "Our First Ajax Application," you'll use what you have learned to construct a complete Ajax application.
While it is essential for a complete understanding of Ajax to understand what role each of the individual components plays, it is thankfully not necessary to rewrite all of your code for each new application. Your Ajax code can be stored as a reusable library of common Ajax routines, ready to be reused wherever they may be needed. There are also many commercial and open-source frameworks that you can use in your projects to do the "heavy lifting."