What is jQuery?
What is jQuery UI?
My personal background
After some basics about jQuery let's start with the actual book review. The book is 420-pages long and explains all the widgets of jQuery UI 1.6 in detail. The structure of the book is rather simple - every widget gets a dedicated chapter. The first chapter deals with downloading jQuery and jQuery UI, setting up a development environment theming (the Theme roller rocks if you just need a theme with your favorite color scheme) and information on the licensing. It's worth repeating that jQuery UI is completely free. Not just free as in GPL which would force you to distribute your web site's sources as GPL, too. In addition it uses the MIT license that gives you all the freedom you need even when you intend to make money with your work.
The following chapters each deal with a certain widget component. Tabs are the first widget to be dealt with in chapter 2. These split several DIV areas into tabs just like in Firefox. Clicking on a tab changes the view to show another DIV. The DIVs are just hidden so clicking on a different tab does not mean your browser has to load content from the web server but instead just hides the old DIV and displays the new content. You can dynamically add or remove tabs, use animations or use AJAX backend calls to load content into a tab.
Chapter 3 deals with a functionally similar widget called Accordion. It looks different and behaves like the musical instrument of the same name. If you click on the title of one DIV then all other DIVs are disappearing with an animation and the desired DIVs is displayed with an animation.
A Slider (chapter 5) is something that I had little use for so far. Use sliders to let the user select a value in a certain range by dragging a handle. You may have seen those in online shops to select a price range of products to display. Sliders can be fixed to certain steps or get two handles to define a minimum and maximum.
Something more common and useful are Date Picker (chapter 6) widgets. They show a calendar sheet and let the use select a date with the mouse. The widget can show weekends in different colors, allows to change month and year and deals with locale settings (e.g. in Germany the week starts on monday and the months are "Januar", "Februar", "März",…). Date pickers are best added to text input fields where the user supposed to enter a date. Once the input field gets the focus the calendar sheet will appear.
My favorite functionality (not quite a widget for itself) is the Auto-Complete feature (chapter 6). It exists as a standalone plugin for jQuery and has been packed into jQuery UI. This is a feature I have always wanted to have since I first saw it. It does lookups in the background while you type in a text input form field and makes suggestions. It's both unobtrusive and really useful. This chapter shows different usages because in real life you will need something unique to your web site.
Drag and drop is a more generic low-level functionality explained in great detail in chapter 8. Make any DIV element draggable which allows it to be moved around with the mouse within defined ranges. I could imagine to have this functionality to create maps by placing elements freely on a page. By adding a drop zone such elements can be moved to a certain zone to trigger further actions. A good example is an online shop where you would drag a product in the shopping cart zone to buy it. The author showed a good sense of humor by using this feature to create a jQuery-based maze. It's not quite what I had used it for but is a nice example nonetheless.
Sometimes it's useful to have the user interactively change the size of an element on a web page. Like the editor window I am just writing this review in. Then you can make the borders of an element interactively and respond to mouse click-and-drag actions by dynamically resizing it. Chapter 9 deals with this Resize functionality. The author eben shows how to combine resizables with tabs in this chapter.
On some occassions a user should select objects from a web page with a mouse. This is accomplished by the Selecting feature (chapter 10). This is nice but honestly I found it not very intuitive for the user to deal with. You can draw boxes to select all objects within the box. But drawing needs to start within the respective area. If you start drawing the rectangle from outside the selectable area then just the text and images on the web page will be selected. It's possible to select multiple objects by holding Ctrl and clicking on objects. Maybe it makes sense in an image gallery. And in fact the author extensively deals with an image gallery on 18 pages here.
Sorting (chapter 11) is a functionality that works more intuitive. It allows to move objects to other places in a list or grid. I once felt the urge to write a todo list web application. Using sorting would allow the user to move a todo item up or down the list. A dashboard/portal could offer different sections that the user can arrange freely by dragging them. The author creates a fully-working dashboard in this chapter on 16 pages. In the end sorting works similar to drag'n'drop but the target sections to drop elements to are pre-defined.
UI effects are the topic of the final chapter 12. Many widgets can use animations for their effects. Like tabs that fade out one DIV and fade in the next DIV. jQuery UI comes with roughly a dozen different animations to choose from. There are many interesting effects like highlighting to draw the user's attention to a certain element. The book helped me understand what the transfer effect is useful for. It moves and resizes a rectangle showing the outline of a starting object and transforms into the outline of the destination object. It can be used to show that a product gets moved into she shopping cart. I wonder why the UI page didn't tell me. :) I thought that this chapter would be boring because how would you describe animations in a book. But interestingly the author shows snapshots of the animation happening and describes what exactly happens. Of course playing with the effects on the jQuery UI home page is also useful.
So much for what's dealt with in each chapter. Do you wonder what information the book provides that you don't find on the web site and vice versa? Obviously the web site can show you the widgets and effects in action which is impossible in a printed book. But many readers prefer a dead tree in their hands instead of reading all the introductory material on the screen. If you are like me spending one hour of your time in the public transport then a book gives you a good chance to get acquainted to the basics without being tempted to try to use the software on your computer too early and getting frustrated.
That aspect aside I found that the author spent a lot of time dealing with each plugin. The existing documentation of jQuery and jQuery UI is very good so I wondered what extra the book would offer. The documentation of the arguments used by each plugin are just copied of course. But the author really jazzed up the documentation by real-life examples. The jQuery UI home page shows how each plugin works and I recommend spending some time there to play around. But once you start building real-life applications you will be grateful for more complex examples instead of just the API.