Ajax in Practice

Dave Crane, Bear Bibeault, Jord Sonneveld, Ted Goddard, Chris Gray, Ram Venkataraman, Joe Walker1932394990, 9781932394993

“Ajax in Practice” provides example-rich coverage of Ajax packed with ready-to-use code and practical recipes for common and not-so-common tasks. Ajax developers now face the move from Ajax-as-theory to Ajax-in-practice. “Ajax in Practice” guides web developers through the transition from learning about Ajax to successfully “applying” Ajax-driven techniques in real-world development scenarios. Ajax gives web developers the potential to create rich user-centered internet applications. But Ajax also adds a new level of complexity and sophistication to those applications. “Ajax in Practice” tackles Ajax head-on, providing countless hands-on techniques and tons of reusable code to address the specific issues developers face when building Ajax-driven solutions. After a brief overview of Ajax, this book takes the reader through dozens of working examples, all presented in an easy-to-use cookbook format. Readers will learn how to implement drag-and-drop interfaces and will discover how to create effective nagigation strategies for their applications. Unlike a traditional cookbook, though, “Ajax in Practice” provides a thorough discussion of each technique presented and shows how the individual components can be connected to create powerful solutions. A fun “mash-up” chapter concludes the book. Throughout “Ajax in Practice,” the examples chosen are interesting, entertaining, and practical.

---

Table of contents :
Ajax in Practice……Page 1
brief contents……Page 6
contents……Page 8
preface……Page 14
acknowledgments……Page 16
about this book……Page 19
Part 1 – Fundamentals of Ajax……Page 26
Embracing Ajax……Page 28
1.1 Ajax as a disruptive technology……Page 29
1.1.1 Redefining the user’s workflow……Page 30
1.1.2 Redefining web application architecture……Page 32
1.2.1 Introducing XMLHttpRequest……Page 34
1.2.2 Instantiating XMLHttpRequest……Page 35
1.2.3 Sending a request……Page 36
1.2.4 Processing the response……Page 38
1.2.5 Other XMLHttpRequest methods and properties……Page 39
1.3 Making Ajax simple using frameworks……Page 41
1.3.1 Making requests with Prototype’s Ajax.Request object……Page 43
1.3.2 Simplifying Ajax responses……Page 46
1.4 Summary……Page 49
How to talk Ajax……Page 51
2.1.1 Evaluating server-generated code……Page 52
2.1.2 Utilizing good code-generation practices……Page 55
2.2 Introducing JSON……Page 59
2.2.1 Generating JSON on the server……Page 61
2.2.2 Round-tripping data using JSON……Page 65
2.3.1 Parsing server-generated XML……Page 69
2.3.2 Better XML handling with XSLT and XPath……Page 75
2.4 Using Ajax with web services……Page 81
2.5 Summary……Page 88
Object-oriented JavaScript and Prototype……Page 89
3.1.1 Object fundamentals……Page 91
3.1.2 Functions are first class……Page 93
3.1.3 Object constructors and methods……Page 101
3.1.4 Writing a JavaScript class: a button……Page 107
3.2 The Prototype library……Page 122
3.2.1 Generally useful functions and extensions……Page 123
3.2.2 Array extensions……Page 125
3.2.3 The Hash class……Page 127
3.2.4 Binding context objects to functions……Page 128
3.2.5 Object-oriented Prototype……Page 130
3.2.6 Rewriting the Button class with Prototype……Page 137
3.3 Summary……Page 141
Open source Ajax toolkits……Page 142
4.1 The Dojo toolkit……Page 143
4.1.1 Asynchronous requests with Dojo……Page 144
4.1.2 Automatic form marshaling with Dojo……Page 148
4.2.1 Asynchronous requests with Prototype……Page 150
4.2.2 Automatic updating with Prototype……Page 156
4.2.3 Periodic updating with Prototype……Page 159
4.3.1 jQuery Basics……Page 161
4.3.2 Asynchronous loading with jQuery……Page 165
4.3.3 Fetching dynamic data with jQuery……Page 170
4.4 DWR……Page 175
4.4.1 Direct Web Remoting with DWR……Page 176
4.5 Summary……Page 184
Part 2 – Ajax Best Practices……Page 186
Handling events……Page 188
5.1.1 Basic event-handling registration……Page 190
5.1.2 Advanced event handling……Page 194
5.2.1 The Event object……Page 197
5.2.2 Event propagation……Page 198
5.3 Using Prototype for event handling……Page 203
5.3.1 The Prototype Event API……Page 204
5.4 Event types……Page 205
5.4.1 Mouse events……Page 206
5.4.2 Keyboard events……Page 207
5.4.3 The change event……Page 210
5.4.4 Page events……Page 211
5.5 Putting events into practice……Page 214
5.5.1 Validating text fields on the server……Page 215
5.5.2 Posting form elements without a page submit……Page 220
5.5.3 Submitting only changed elements……Page 223
5.6 Summary……Page 226
Form validation and submission……Page 227
6.1.1 Validating on the client side……Page 228
6.1.2 Instant validation……Page 234
6.1.3 Cross-field validation……Page 236
6.2.1 Anatomy of a POST……Page 243
6.2.2 Posting data to a server……Page 245
6.2.3 Posting form data to a server……Page 248
6.2.4 Detecting form data changes……Page 252
6.3 Summary……Page 258
Content navigation……Page 259
7.1.1 Finding the needle in the haystack……Page 260
7.1.2 Making a better needle-finder……Page 262
7.1.3 Navigation and Ajax……Page 263
7.2.1 A simple navigation menu……Page 266
7.2.2 DHTML menus……Page 268
7.3 Borrowing navigational aids from the desktop app……Page 272
7.3.1 The qooxdoo tab view……Page 273
7.3.2 The qooxdoo toolbar and windows……Page 275
7.3.3 The qooxdoo tree widget……Page 279
7.4.1 The OpenRico Accordion control……Page 284
7.4.2 Building an HTML-friendly tree control……Page 288
7.5 Summary……Page 295
Handling back, refresh, and undo……Page 296
8.1.1 Removing the toolbars……Page 297
8.1.2 Capturing keyboard shortcuts……Page 299
8.1.3 Disabling the right-click context menu……Page 300
8.1.4 Preventing users from navigating history or refreshing……Page 301
8.2.1 Using the JavaScript history object……Page 305
8.2.2 Hashes as bookmarks……Page 306
8.2.3 Introducing the Really Simple History (RSH) framework……Page 308
8.2.4 Using RSH to maintain state at the client level……Page 309
8.2.5 Using RSH to maintain state at the server level……Page 314
8.3 Handling undo operations……Page 318
8.3.1 When to provide undo capability……Page 319
8.3.2 Implementing an undo stack……Page 320
8.3.3 Extending the undo stack for more complex actions……Page 325
8.4 Summary……Page 334
Drag and drop……Page 336
9.1 JavaScript drag-and-drop frameworks……Page 338
9.2.1 Drag-and-drop Ajax shopping cart……Page 339
9.2.2 Manipulating data in lists……Page 346
9.2.3 The Ajax shopping cart using ICEfaces……Page 351
9.3 Summary……Page 360
Being user-friendly……Page 361
10.1.1 Countering latency with feedback……Page 363
10.1.2 Showing progress……Page 370
10.1.3 Timing out Ajax requests……Page 376
10.1.4 Dealing with multiple clicks……Page 380
10.2.1 Displaying proactive contextual help……Page 384
10.2.2 Validating form entries……Page 391
10.3 Maintaining focus and layering order……Page 399
10.3.1 Maintaining focus order……Page 400
10.3.2 Managing stacking order……Page 406
10.4 Summary……Page 412
State management and caching……Page 413
11.1 Maintaining client state……Page 415
11.2 Caching server data……Page 417
11.2.1 Exchanging Java class data……Page 418
11.2.2 Prefetching……Page 427
11.3.1 Storing and retrieving user state with JSON……Page 431
11.3.2 Persisting JSON strings through AMASS……Page 434
11.4 Summary……Page 438
Open web APIs and Ajax……Page 440
12.1 The Yahoo! Developer Network……Page 441
12.1.1 Yahoo! Maps……Page 442
12.1.2 The cross-server proxy……Page 446
12.1.3 Yahoo! Maps Geocoding……Page 455
12.1.4 Yahoo! Traffic……Page 461
12.2.1 Google search……Page 468
12.3 Flickr photos……Page 479
12.3.1 Flickr identification……Page 480
12.3.2 Flickr photos and thumbnails……Page 484
12.4.2 eBay services……Page 489
12.5 Summary……Page 490
Mashing it up with Ajax……Page 491
13.1.1 Application purpose……Page 492
13.1.2 Application overview and requirements……Page 493
13.2.1 What format should we use?……Page 494
13.2.2 The trip data format……Page 495
13.2.3 Setting up Flickr photo sets……Page 496
13.3.1 The dependency check……Page 498
13.3.2 The TripomaticDigester constructor……Page 499
13.3.3 Digesting the trip data……Page 500
13.3.4 Loading the points of interest……Page 501
13.3.5 Collecting element text……Page 502
13.4 The Tripomatic application class……Page 504
13.4.1 The Tripomatic class and constructor……Page 505
13.4.2 Creating the content elements……Page 507
13.4.3 Filling in the trip data……Page 509
13.4.4 Showing the map……Page 512
13.4.5 Loading the thumbnails……Page 513
13.4.6 Displaying the photos……Page 516
13.5.1 The Trip-o-matic HTML document……Page 517
13.5.2 Tripping along with style……Page 519
13.6 Summary……Page 521
A……Page 524
C……Page 525
E……Page 526
G……Page 527
J……Page 528
O……Page 529
Q……Page 530
T……Page 531
X……Page 532
Z……Page 533