Pragmatic Ajax a Web 2.0 Primer
Total Page：16
File Type：pdf, Size：1020Kb
Pragmatic Ajax A Web 2.0 Primer Justin Gehtland Ben Galbraith Dion Almaer The Pragmatic Bookshelf Raleigh, North Carolina Dallas, Texas P r a g m a t i c B o o k s h e l f Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in this book, and The Pragmatic Programmers, LLC was aware of a trademark claim, the designations have been printed in initial capital letters or in all capitals. The Pragmatic Starter Kit, The Pragmatic Programmer, Pragmatic Programming, Pragmatic Bookshelf and the linking g device are trademarks of The Pragmatic Programmers, LLC. Every precaution was taken in the preparation of this book. However, the publisher assumes no responsibility for errors or omissions, or for damages that may result from the use of information (including program listings) contained herein. Our Pragmatic courses, workshops, and other products can help you and your team create better software and have more fun. For more information, as well as the latest Pragmatic titles, please visit us at http://www.pragmaticprogrammer.com Copyright © 2006 The Pragmatic Programmers LLC. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmit- ted, in any form, or by any means, electronic, mechanical, photocopying, recording, or otherwise, without the prior consent of the publisher. Printed in the United States of America. ISBN 0-9766940-8-5 Printed on acid-free paper with 85% recycled, 30% post-consumer content. First printing, March 2006 Version: 2006-4-27 Contents Acknowledgments vii 1 Building Rich Internet Applications with Ajax 1 1.1 A Tale in Three Acts ..................... 2 1.2 Google Maps: The Missing Spark ............. 4 1.3 What Is Ajax? ......................... 5 1.4 Whither Now? ......................... 8 2 Creating Google Maps 9 2.1 Rocket Scientists? ...................... 10 2.2 Your Own Google Maps ................... 11 2.3 Creating Ajaxian Maps ................... 16 2.4 Conclusion .......................... 47 3 Ajax in Action 48 3.1 Ajaxifying a Web Application ................ 48 3.2 Ajax to the Rescue ...................... 48 3.3 The Grubby Details ..................... 56 3.4 Wrapping Up ......................... 59 4 Ajax Explained 60 4.1 A Review of Client-Side JavaScript ............. 61 4.2 Manipulating the Web Page ................. 67 4.3 Retrieving Data ........................ 73 4.4 Summary ........................... 76 5 Ajax Frameworks 77 5.1 Frameworks, Toolkits, and Libraries ........... 77 5.2 Remoting with the Dojo Toolkit ............... 82 5.3 Remoting with the Prototype Library ........... 90 5.4 Wrapping Up ......................... 92 CONTENTS v 6 Ajax UI, Part I 93 6.1 Ajax and JavaScript for the UI ............... 93 6.2 Conclusion .......................... 121 7 Ajax UI, Part II 122 7.1 Some Standard Usages ................... 122 7.2 It Isn’t All Just Wine and Roses... ............. 137 7.3 Conclusion .......................... 146 8 Debugging Ajax Applications 147 8.1 View Source .......................... 147 8.2 DOM Inspectors ....................... 148 8.3 JavaScript Debugging .................... 160 8.4 Conclusion .......................... 169 9 Degradable Ajax 170 9.1 What Is Degradable Ajax? .................. 170 9.2 Ensuring Degradable Ajax Applications .......... 172 9.3 Wrapping Up ......................... 183 10 JSON and JSON-RPC 184 10.1 JSON-RPC ........................... 187 11 Server-side Framework Integration 192 11.1 Different Strategies for Integration ............. 193 12 Ajax with PHP 195 12.1 The PHP Frameworks .................... 195 12.2 Working with Sajax ..................... 196 12.3 XOAD ............................. 204 12.4 Wrapping Up ......................... 209 13 Ajax with Rails 210 13.1 Ruby on Rails ......................... 210 13.2 Ajax Integration ........................ 214 13.3 The Future of Ajax in Rails ................. 227 14 Proxy-Based Ajax with DWR 230 14.1 DWR .............................. 231 14.2 Conclusion .......................... 245 CONTENTS vi 15 ASP.NET and Atlas 246 15.1 BorgWorX ........................... 247 15.2 Atlas .............................. 249 15.3 Conclusion .......................... 258 16 Ajax in the Future and Beyond 259 16.1 Data Manipulation ...................... 259 16.2 UI Manipulation ....................... 263 16.3 Predictions .......................... 275 16.4 Conclusion .......................... 278 Acknowledgments Writing a book is a lot like (we imagine) flying a spaceship too close to a black hole. One second you’re thinking “Hey, there’s something interesting over there” and a picosecond later, everything you know and love has been sucked inside and crushed. OK, that’s hyperbole, but the point is that books don’t write themselves. More to the point, books aren’t even just written by the authors. It takes the combined efforts of a lot of people to extract information from the chaos. We’d like to hereby issue the following thanks. To every single beta purchaser of the book and especially the ones who sent in all those errata posts. You are a fantastic bunch, and we can’t thank you enough for your belief in the project and your help in making it a better book. To the team at the Pragmatic Programmers (especially you, Dave): you exhibited endless patience, forbearance, and wisdom during the pro- cess. Finally, to the authors of all the wonderful frameworks and tools we highlight in this book: your work is inspiring and we hope that this book helps shed just a little more light on the work you’ve done. From Justin Gehtland To my coauthors: thanks for thinking of me. My colleagues are an endless font of inspiration and vexation, both of which help with the creative process. So, thanks to Stu Hal- loway, Glenn Vanderburg, Neal Ford, and Ted Neward, all of whom provided various amounts of both. I keep telling my family that one day I’ll write a book they’d like to read. At least this one has an interesting cover. Lisa, Zoe, and Gabe: thanks for putting up with my office hours. ACKNOWLEDGMENTS viii From Ben Galbraith Thank you to my family, for all your patience while I spent late nights and early mornings working on this project. I love you. My sincere gratitude also goes to my publisher Dave Thomas (who patiently and gracefully watched this project go from early arrival to, well, somewhat less than early arrival) and my fellow authors, Justin Gehtland and Dion Almaer, who made many personal sac- rifices to get across the finish line. Finally, I thank all of my peers and colleagues who have taught me throughout the years. The patience and kindness of nearly everyone in our industry has always been an inspiration to me. From Dion Almaer Ah, acknowledgments. This is the moment where you feel like you are at the podium and don’t want to forget anyone. Firstly, I would like to thank my fellow Ajaxians: Ben Galbraith, Justin Gehtland, Stu Halloway, Rob Sanheim, Michael Mahemoff, and the entire community that visits and contributes to ajax- ian.com. This book is really for you, the readers. Secondly, I would like to thank all of the great technical folk who I have had the pleasure of working with. This includes buddies from Adigio, the No Fluff Just Stuff tour, and the general blogosphere. You know who you are. Finally, I would like to thank my family, especially my wife, Emily, who lets me work crazy hours without putting me through guilt trips. You are my best friend, Em. Chapter 1 Building Rich Internet Applications with Ajax This is a book about developing effective web applications. We’re not going to dance around this issue. Underneath everything else, this book is about XHTML, JavaScript, CSS, and standards that have been around for almost a decade now. Not only do we admit this truth, we embrace it. Just because these standards have been around for a while doesn’t mean we can’t build something new and exciting out of them. Technology, like Jello, takes a while to solidify into something tasty and satisfying. Ajax (and Web 2.0) represents the maturation of Internet standards into a viable application development platform. The combination of stable standards, better understanding, and a unifying vision amount to a whole that is greater, by far, than the sum of its parts. With Ajax, you’ll be able to achieve the double Holy Grail: feature-filled user interfaces and a no-hassle, no-install deployment story. It wasn’t long ago that Jesse James Garrett coined the term Ajax. When he first released the term onto the public consciousness, it stood for Asynchronous JavaScript And XML. It has since, like SOAP before it, lost its acronym status and is just a word. However, it is an enormously powerful word. With this single word, Jesse James was able to harness an industry-wide trend toward richer, install-free web applications and give it focus. Naming a thing is powerful. In this case, it’s not powerful enough to become a movement, though. A spark was still lacking. It was to be ATALE IN THREE ACTS 2 provided by an entirely unlikely entity. What follows is the story of one development team, that spark, and how it changed the way we approach web software. 1.1 A Tale in Three Acts Hector is a project manager for a web application development shop. With a long history of Perl, CGI, ASP, Servlet, and JSP development under his belt, Hector’s been around the block. For the last year his team has been building a CRM application for a large Fortune 500 com- pany with offices all over the world. The application used to be a green- screen mainframe application; the company wants to take advantage of the great reach of the Internet to deploy the application to every office. Hector and his team focus a lot of their energy on the server side of the application. They have been using one of the modern MVC frame- works from the Java community to implement the business logic, a high-performance persistence framework to access the database, and messaging-based infrastructure to connect to other existing systems.