Professional Ajax pdf

www.it-ebooks.info

Professional

Ajax

2nd Edition

Nicholas C. Zakas

Jeremy McPeak

Joe Fawcett

01_109496 ffirs.qxd 2/5/07 6:41 PM Page i

www.it-ebooks.info

01_109496 ffirs.qxd 2/5/07 6:41 PM Page i

www.it-ebooks.info

Professional

Ajax

2nd Edition

Nicholas C. Zakas

Jeremy McPeak

Joe Fawcett

01_109496 ffirs.qxd 2/5/07 6:41 PM Page i

www.it-ebooks.info

Professional Ajax, 2nd Edition

Published by

Wiley Publishing, Inc.

10475 Crosspoint Boulevard

Indianapolis, IN 46256

www.wiley.com

Copyright © 2007 by Wiley Publishing, Inc., Indianapolis, Indiana

Published simultaneously in Canada

ISBN: 978-0-470-10949-6

Manufactured in the United States of America

10 9 8 7 6 5 4 3 2 1

Library of Congress Cataloging-in-Publication Data:˙

Zakas, Nicholas C.

Professional Ajax / Nicholas C. Zakas, Jeremy McPeak, Joe Fawcett. -- 2nd ed.

p. cm.

Includes index.

ISBN-13: 978-0-470-10949-6 (paper/website)

ISBN-10: 0-470-10949-1 (paper/website)

1. Ajax (Web site development technology) 2. Web sites--Design--Computer programs. 3. JavaScript (Computer pro￾gram language) 4. Asynchronous transfer mode. 5. World Wide Web. I. McPeak, Jeremy, 1979- II. Fawcett, Joe, 1962-

III. Title.

TK5105.8885.A52Z35 2007

005.13'3--dc22

2006103094

No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or by any

means, electronic, mechanical, photocopying, recording, scanning or otherwise, except as permitted under Sections

107 or 108 of the 1976 United States Copyright Act, without either the prior written permission of the Publisher, or

authorization through payment of the appropriate per-copy fee to the Copyright Clearance Center, 222 Rosewood

Drive, Danvers, MA 01923, (978) 750-8400, fax (978) 646-8600. Requests to the Publisher for permission should be

addressed to the Legal Department, Wiley Publishing, Inc., 10475 Crosspoint Blvd., Indianapolis, IN 46256, (317)

572-3447, fax (317) 572-4355, or online at http://www.wiley.com/go/permissions.

LIMIT OF LIABILITY/DISCLAIMER OF WARRANTY: THE PUBLISHER AND THE AUTHOR MAKE NO REPRE￾SENTATIONS OR WARRANTIES WITH RESPECT TO THE ACCURACY OR COMPLETENESS OF THE CON￾TENTS OF THIS WORK AND SPECIFICALLY DISCLAIM ALL WARRANTIES, INCLUDING WITHOUT

LIMITATION WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE. NO WARRANTY MAY BE CREATED

OR EXTENDED BY SALES OR PROMOTIONAL MATERIALS. THE ADVICE AND STRATEGIES CONTAINED

HEREIN MAY NOT BE SUITABLE FOR EVERY SITUATION. THIS WORK IS SOLD WITH THE UNDERSTANDING

THAT THE PUBLISHER IS NOT ENGAGED IN RENDERING LEGAL, ACCOUNTING, OR OTHER PROFES￾SIONAL SERVICES. IF PROFESSIONAL ASSISTANCE IS REQUIRED, THE SERVICES OF A COMPETENT PROFES￾SIONAL PERSON SHOULD BE SOUGHT. NEITHER THE PUBLISHER NOR THE AUTHOR SHALL BE LIABLE

FOR DAMAGES ARISING HEREFROM. THE FACT THAT AN ORGANIZATION OR WEBSITE IS REFERRED TO

IN THIS WORK AS A CITATION AND/OR A POTENTIAL SOURCE OF FURTHER INFORMATION DOES NOT

MEAN THAT THE AUTHOR OR THE PUBLISHER ENDORSES THE INFORMATION THE ORGANIZATION OR

WEBSITE MAY PROVIDE OR RECOMMENDATIONS IT MAY MAKE. FURTHER, READERS SHOULD BE AWARE

THAT INTERNET WEBSITES LISTED IN THIS WORK MAY HAVE CHANGED OR DISAPPEARED BETWEEN

WHEN THIS WORK WAS WRITTEN AND WHEN IT IS READ.

For general information on our other products and services please contact our Customer Care Department within the

United States at (800) 762-2974, outside the United States at (317) 572-3993 or fax (317) 572-4002.

Trademarks: Wiley, the Wiley logo, Wrox, the Wrox logo, Programmer to Programmer, and related trade dress are

trademarks or registered trademarks of John Wiley & Sons, Inc. and/or its affiliates, in the United States and other

countries, and may not be used without written permission. All other trademarks are the property of their respective

owners. Wiley Publishing, Inc., is not associated with any product or vendor mentioned in this book.

Wiley also publishes its books in a variety of electronic formats. Some content that appears in print may not be avail￾able in electronic books.

01_109496 ffirs.qxd 2/5/07 6:41 PM Page ii

www.it-ebooks.info

To mom, dad, Greg, Yiayia, and the rest of my family and friends who have

supported me throughout my cross-country move.

—Nicholas C. Zakas

To the love of my life, Starla. Thank you for your love, patience, and

encouragement.

—Jeremy McPeak

To my parents, Sheila and William, who instilled in me a love of reading.

Thank you!

—Joe Fawcett

01_109496 ffirs.qxd 2/5/07 6:41 PM Page iii

www.it-ebooks.info

About the Authors

Nicholas C. Zakas has a BS in Computer Science from Merrimack College and an MBA from Endicott

College. He is the author of Professional JavaScript for Web Developers (Wiley 2005) as well as several

online articles. Nicholas works for Yahoo! as a frontend engineer and has worked in web development

for more than 6 years, during which time he has helped develop web solutions in use at some of the

largest companies in the world. Nicholas can be reached through his web site at www.nczonline.net.

Jeremy McPeak began tinkering with web development as a hobby in 1998. Currently working in the IT

department of a school district, Jeremy has experience developing web solutions with JavaScript, PHP,

and C#. He has written several online articles covering topics such as XSLT, WebForms, and C#. He is

also co-author of Beginning JavaScript, 3rd Edition (Wiley 2007). Jeremy can be reached through his web

site at www.wdonline.com.

Joe Fawcett started programming in the 1970s and briefly worked in IT upon leaving full-time educa￾tion. He then pursued a more checkered career before returning to software development in 1994. In

2003 he was awarded the title of Microsoft Most Valuable Professional in XML for community contribu￾tions and technical expertise. He currently works in London as a developer for FTC Kaplan, a leading

international provider of accountancy and business training, where he specializes in systems integration.

01_109496 ffirs.qxd 2/5/07 6:41 PM Page iv

www.it-ebooks.info

Credits

Senior Acquisitions Editor

Jim Minatel

Senior Development Editor

Kevin Kent

Technical Editor

Alexei Gorkov

Production Editor

Angela Smith

Copy Editor

Jeri Freedman

Editorial Manager

Mary Beth Wakefield

Production Manager

Tim Tate

Vice President and Executive Group Publisher

Richard Swadley

Vice President and Executive Publisher

Joseph B. Wikert

Graphics and Production Specialists

Sean Decker

Jennifer Mayberry

Amanda Spagnuolo

Alicia B. South

Quality Control Technician

Rob Springer

Project Coordinator

Bill Ramsey

Proofreading

Christopher Jones

Indexing

Johnna VanHoose Dinse

Anniversary Logo Design

Richard Pacifico

01_109496 ffirs.qxd 2/5/07 6:41 PM Page v

www.it-ebooks.info

Acknowledgments

It takes many people to create a book such as this, and as such, we’d like to thank some people for their

contributions to this work.

First and foremost, thanks to everyone at Wiley for their support: to Jim Minatel for starting the process

once again, and Kevin Kent for putting up with all of the last-minute changes and course diversions

throughout the process. Also, a thanks to our technical editor, Alexei Gorkov, for doing a fantastic job

keeping us honest.

Last, a big thanks to those who provided feedback pre-publication including Peter Frueh, Adam Moore,

Jenny Han, Matt Sweeney, Tyson Guskiken, Steve Carlson, and especially Hedger Wang, who suggested

adding the chapter on request management.

01_109496 ffirs.qxd 2/5/07 6:41 PM Page vi

www.it-ebooks.info

Contents

Introduction xv

Chapter 1: What Is Ajax? 1

Ajax Is Born 2

The Evolution of the Web 2

JavaScript 2

Frames 3

The Hidden Frame Technique 3

Dynamic HTML and the DOM 3

Iframes 4

XMLHttp 4

The Real Ajax 5

Ajax Principles 6

Technologies behind Ajax 6

Who Is Using Ajax? 7

Google Suggest 7

Gmail 8

Google Maps 9

A9 10

Yahoo! News 11

Bitflux Blog 12

Confusion and Controversy 13

Ajax and Web 2.0 14

Summary 15

Chapter 2: Ajax Basics 17

HTTP Primer 17

HTTP Requests 18

HTTP Responses 20

Ajax Communication Techniques 21

The Hidden Frame Technique 21

XMLHttp Requests (XHR) 37

Ajax with Images 50

Dynamic Script Loading 59

Cache Control 63

Summary 63

02_109496 ftoc.qxd 2/5/07 6:46 PM Page vii

www.it-ebooks.info

viii

Contents

Chapter 3: Ajax Patterns 65

Communication Control Patterns 65

Predictive Fetch 66

Page Preloading Example 66

Submission Throttling 74

Incremental Form Validation Example 76

Incremental Field Validation Example 82

Periodic Refresh 85

New Comment Notifier Example 86

Multi-Stage Download 90

Additional Information Links Example 91

Fallback Patterns 93

Cancel Pending Requests 94

Try Again 96

Summary 97

Chapter 4: Ajax Libraries 99

The Yahoo! Connection Manager 99

Setup 99

Basic Requests 100

The Callback Object 100

Monitoring and Managing Requests 104

Form Interaction 104

File Uploads 105

GET Example 106

POST Example 107

Additional Features 108

Limitations 108

Prototype 109

The Ajax.Request Object 109

The Options Object 109

GET Example 112

POST Example 113

The Ajax.Updater Object 113

The Ajax.Responders Object 115

Advantages and Disadvantages 117

jQuery 117

Simple jQuery Expressions 117

Executing GET Requests 118

GET Example 119

02_109496 ftoc.qxd 2/5/07 6:46 PM Page viii

www.it-ebooks.info

ix

Contents

The $.post() Method 120

POST Example 120

The load() Method 122

The $.ajax() Method 123

The ajaxStart() and ajaxStop() Methods 124

Limitations 124

Summary 125

Chapter 5: Request Management 127

Priority Queues 127

The RequestManager Object 131

Request Description Objects 132

Queuing Requests 133

Sending Requests 134

Cancelling Requests 139

Age-Based Promotion 141

Handling Ajax Patterns 142

Using RequestManager 145

Summary 148

Chapter 6: XML, XPath, and XSLT 149

XML Support in Browsers 149

XML DOM in IE 149

XML in Other Browsers 159

Cross-Browser XML 162

A Basic XML Example 163

XPath Support in Browsers 170

Introduction to XPath 170

XPath in IE 172

Working with Namespaces 173

XPath in Other Browsers 175

Working with a Namespace Resolver 177

Cross-Browser XPath 178

XSL Transformation Support in Browsers 179

Introduction to XSLT 180

XSLT in IE 182

XSLT in Other Browsers 187

Cross-Browser XSLT 189

Best Picks Revisited 189

Summary 192

02_109496 ftoc.qxd 2/5/07 6:46 PM Page ix

www.it-ebooks.info

x

Contents

Chapter 7: Syndication with RSS and Atom 193

RSS 193

RSS 0.91 194

RSS 1.0 195

RSS 2.0 196

Atom 196

XParser 197

The xparser Namespace 197

Retrieving the Data 198

The Abstract Classes 198

Creating a News Ticker 210

The Server-Side Component 210

The Client-Side Component 211

Styling the News 221

Using the News Ticker Widget 222

Web Search with RSS 223

The Server-Side Component 224

The Client-Side Component 225

Customizing the Web Search Widget 232

Using the Web Search Widget 234

Summary 235

Chapter 8: JSON 237

What Is JSON? 237

Array Literals 237

Object Literals 238

Mixing Literals 239

JSON Syntax 240

JSON Encoding/Decoding 241

JSON versus XML 242

Server-Side JSON Tools 243

JSON-PHP 243

Other Tools 245

Creating an Autosuggest Textbox 246

Functionality Overview 246

The HTML 247

The Database Table 249

The Architecture 249

The Classes 250

The AutoSuggest Control 250

02_109496 ftoc.qxd 2/5/07 6:46 PM Page x

www.it-ebooks.info

xi

Contents

The Suggestion Provider 267

The Server-Side Component 268

The Client-Side Component 270

Summary 272

Chapter 9: Comet 273

HTTP Streaming 274

Request Delays 274

File Modification Example 276

Using Iframes 277

Browser-Specific Approaches 282

Server-Sent DOM Events 291

Connection Management 296

Server-Side Support 297

Summary 298

Chapter 10: Maps and Mashups 299

The Rise of Mashups 300

Geocoding 300

Geocoding Web Sites 300

Geocoding Services 301

Google Maps API 301

How Does It Work? 301

Getting Started 302

Google Maps Basics 303

Controls 304

Moving the Map 306

Info Windows 306

Events 311

Map Overlays 313

Additional Information 321

Yahoo! Maps API 321

Getting Started 321

Yahoo! Maps Basics 322

Controls 324

Moving the Map 325

Smart Windows 326

Events 327

Map Overlays 328

Address Lookup 334

Additional Information 334

02_109496 ftoc.qxd 2/5/07 6:46 PM Page xi

www.it-ebooks.info

xii

Contents

Other Mapping APIs 335

Summary 335

Chapter 11: Ajax Debugging Tools 337

The Problem 337

FireBug 338

Installation and Setup 338

The Interface 339

XHR Logging 340

Ajax Debugging with FireBug 341

FireBug Limitations 342

Microsoft Fiddler 342

Installation and Setup 343

The Interface 344

HTTP Breakpoints 347

Ajax Debugging with Fiddler 348

Summary 349

Chapter 12: Web Site Widgets 351

Creating a Weather Widget 351

The Weather.com SDK 351

The Server-Side Component 352

The Client-Side Component 361

Getting Data from the Server 361

Customizing the Weather Widget 362

Setting Up the Weather Widget as an Application 366

Adding the Weather Widget to the Web Page 370

Watching Stocks 371

Getting Yahoo! Finance Information 371

The Stock Quote Proxy 372

Client Component: The AjaxStockWatcher Class 376

Customizing the Stock Quotes 385

Using the Stock Watcher Widget 387

Creating a Site Search Widget 388

The Server-Side Component 389

The Client-Side Component 398

Customizing the Site Search Widget 403

Adding the Site Search Widget to a Page 405

Summary 406

02_109496 ftoc.qxd 2/5/07 6:46 PM Page xii

www.it-ebooks.info