422

CHAPTER 10

Type-ahead suggest

pretty cool, and it covers all the bases that we listed in table 10.2. The component source code is available in its entirety at http://www.manning.com/crane. Rico can be found at http://openrico.org/ and Prototype at http://prototype. conio.net/.

10.6 Summary

The type-ahead suggest lets your users save time by offering the options that they may need as they are typing. When they type a few keystrokes on the keyboard, the data that they want is available for selection. This chapter has looked at the downfalls of the currently available implementations and has initiated an application that lets us eliminate any unnecessary postbacks to the server by doing most of the processing on the client. We have worked with DHTML to create a dynamic user interface that allows interaction with the keyboard and the mouse. This example shows how Ajax can be used effectively to add a seamless interaction with the server without disrupting the user’s interactions with the web page. This script also degrades well with browsers that do not support Ajax, since the type-ahead textbox acts like a plain textbox into which users can enter data rather than just having a quick solution at their fingertips. Finally, we pushed the envelope of object-oriented JavaScript component development by refactoring the script into an easily created, configured, and used TextSuggest component. Licensed to jonathan zheng

The enhanced

Ajax web portal

This chapter covers

■

Constructing an Ajax portal

■

Implementing a login framework

■

Creating dynamic windows

■

Remembering window state

■

Adapting library code

423

Licensed to jonathan zheng

424

CHAPTER 11

The enhanced Ajax web portal

More and more companies have been adopting a portal-based intranet. Portals give users an easy gateway for obtaining large quantities of information on one page. This eliminates the need for the user to go to multiple locations to get the information they need. Online portals such as Yahoo! allow us to obtain news, weather, sports scores, mail, games, and so much more on just one page. Another portal is Amazon’s A9.com search portal, which lets us do searches on multiple areas without going to separate pages. We can search for web pages, books, images, and much more on one page. A9.com utilizes Ajax to display the information on the screen. This allows for a great user experience since the user does not have to sit and wait for page re-rendering when new search results are displayed.

In this chapter, we are incorporating Ajax into a portal to improve the user’s experience: specifically, how he logs into the system and how the system remembers his details. The portal project will allow the user to customize the layout of the portal with a minimum amount of effort. The user will not even realize that his actions are sending information back to the server to remember the exact location of the objects on the page. This means that his personal settings are the same every time he logs into the system. We first take a low-level approach to building the portal. We implement a basic portal framework in a less-structured manner to shed light on the concept behind the portal. We then look at the portal in a more advanced light using an object-oriented approach. Before we implement the portal, let’s examine some current portals and see how adding Ajax can improve the user’s experience.

11.1 The evolving portal

Over time, portals have evolved from simple sites that let us check our mail and do a search to elaborate setups that allow us to obtain a large amount of information in little