AJAX In Action [39]
There are at least two levels at which Ajax can be used—and several positions between these as we let go of the classic page-based approach. The simplest strategy is to develop Ajax-based widgets that are largely self-contained and that can be added to a web page with a few imports and script statements. Stock tickers, interactive calendars, and chat windows might be typical of this sort of widget. Islands of application-like functionality are embedded into a document-like web page (figure 2.6). Most of Google’s current forays into Ajax (see section 1.3) fit this model. The drop-down box of Google Suggest and the map widget in Google Maps are both interactive elements embedded into a page.
If we want to adopt Ajax more adventurously, we can turn this model inside out, developing a host application in which application-like and document-like fragments can reside (figure 2.7). This approach is more analogous to a desktop application, or even a window manager or desktop environment. Google’s GMail Licensed to jonathan zheng 66 CHAPTER 2 First steps with Ajax Ajax application WIdget Content 1 Blah blah blah blah Logic Data model blah blah blah blah blah blah blah blah blah blah blah blah blah blah Content 2 Blah blah blah blah blah blah blah blah blah blah blah blah blah blah Logic Data blah blah blah blah model Figure 2.6 A simple Ajax application will still work like a web page, with islands of interactive functionality embedded in the page. fits this model, with individual messages rendering as documents within an interactive, application-like superstructure. In some ways, learning the technologies is the easy part. The interesting challenge in developing with Ajax is in learning how to use them together. We are accustomed to thinking of web applications as storyboards, and we shunt the user from one page to another following a predetermined script. With applicationlike functionality in our web application, we can provide the user with a more fine-grained handle on the business domain, which can enable a more free-form problem-solving approach to his work. Web page Blah Blah blah blah blah WIdget 1 blah blah blah blah blah blah blah blah blah blah Logic Data model blah blah blah blah blah blah blah Blah blah blah blah blah blah blah blah blah blah blah blah WIdget 2 Blah blah blah blah Figure 2.7 blah blah blah In a more complex Ajax application, the Logic Data blah blah blah blah blah model blah blah entire application is an interactive blah blah blah blah system, into which islands of documentlike content may be loaded or programmatically declared. Licensed to jonathan zheng Summary 67 In order to gain the benefits of this greater flexibility, we have to question a lot of our coding habits. Is an HTML form the only way for a user to input information? Should we declare all our user interfaces as HTML? Can we contact the server in response to user interactions such as key presses and mouse movements, as well as the conventional mouse click? In the fast-paced world of information technology, we place a large emphasis on learning new skills, but unlearning old habits can be at least as important. 2.7 Summary In this chapter, we’ve introduced the four technical pillars of Ajax. JavaScript is a powerful general-purpose programming language with a bad reputation for generating pop-up windows, back-button hacks, and image rollovers. Appendix B contains a more detailed description of some of the features of the language, but from the examples here, you should be able to get a feel for how it can be used to genuinely