Teach Yourself A jax 10 in Minutes Phil Ballard 800 East 96th Street,Indianapolis,Indiana,46240 USA Sams Teach Yourself ACQUISITIONSEDITOR Linda Harrison Ajax in 10 Minutes DEVELOPMENTEDITOR Copyright 2006 by Sams Publishing Damon Jordan All rights reserved. No part of this book shall be reproduced, MANAGINGEDITOR stored in a retrieval system,or transmitted by any means,elec- Charlotte Clapp tronic,mechanical,photocopying,recording,or otherwise,without written permission from the publisher. No patent liability is PROJECTEDITOR assumed with respect to the use of the information contained Seth Kerney herein. Although every precaution has been taken in the prepara- tion of this book,the publisher and author assume no responsibility COPYEDITOR for errors or omissions. Nor is any liability assumed for damages Geneil Breeze resulting from the use of the information contained herein. International Standard Book Number:0-672-32868-2 INDEXER Ken Johnson Library of Congress Catalog Card Number:2005934928 Printed in the United States of America PROOFREADER First Printing:April 2006 Leslie Joseph 09 08 07 06 4 3 2 1 TECHNICALEDITOR Trademarks Bill Bercik All terms mentioned in this book that are known to be trade- PUBLISHING marks or service marks have been appropriately capitalized. COORDINATOR Sams Publishing cannot attest to the accuracy of this informa- Vanessa Evans tion. Use of a term in this book should not be regarded as affecting the validity of any trademark or service mark. MULTIMEDIA DEVELOPER Warning and Disclaimer Dan Scherf Every effort has been made to make this book as complete and INTERIORDESIGNER as accurate as possible,but no warranty or fitness is implied. Gary Adair The information provided is on an “as is”basis. The author and the publisher shall have neither liability nor responsibility to COVERDESIGNER any person or entity with respect to any loss or damages arising Aren Howell from the information contained in this book or from the use of the CD or programs accompanying it. PAGELAYOUT TnT Design Bulk Sales Sams Publishing offers excellent discounts on this book when ordered in quantity for bulk purchases or special sales. For more information,please contact U.S. Corporate and Government Sales 1-800-382-3419 [email protected] For sales outside of the U.S.,please contact International Sales [email protected] Contents Introduction 1 About This Book..................................................................................1 What Is Ajax?......................................................................................1 Who This Book Is For ........................................................................3 What Do I Need To Use This Book?..................................................3 Conventions Used in This Book..........................................................3 Online Resources and Errata ..............................................................4 PART I A Refresher on Web Technologies 1 Anatomy of a Website 5 A Short History of the Web ................................................................5 Workings of the World Wide Web ......................................................6 Summary............................................................................................12 2 Writing Web Pages in HTML 13 Introducing HTML............................................................................13 Elements of an HTML Page..............................................................16 A More Advanced HTML Page........................................................21 Some Useful HTML Tags..................................................................23 Cascading Style Sheets in Two Minutes............................................25 Summary............................................................................................26 3 Sending Requests Using HTTP 27 Introducing HTTP..............................................................................27 The HTTP Request and Response ....................................................28 HTML Forms ....................................................................................31 Summary............................................................................................35 iv Sams Teach Yourself Ajax in Ten Minutes 4 Client-Side Coding Using JavaScript 36 About JavaScript................................................................................36 In at the Deep End ............................................................................38 Manipulating Data in JavaScript........................................................49 Summary............................................................................................52 5 Server-Side Programming in PHP 53 Introducing PHP................................................................................53 Embedding PHP in HTML Pages......................................................54 Variables in PHP................................................................................56 Controlling Program Flow ................................................................58 Summary............................................................................................60 6 A Brief Introduction to XML 61 Introducing XML ..............................................................................61 XML Basics ......................................................................................62 JavaScript and XML..........................................................................66 The Document Object Model (DOM) ..............................................67 Summary............................................................................................69 PART II Introducing Ajax 7 Anatomy of an Ajax Application 70 The Need for Ajax ............................................................................70 Introducing Ajax................................................................................73 The Constituent Parts of Ajax............................................................75 Putting It All Together ......................................................................78 Summary............................................................................................79 8 The XMLHTTPRequest Object 80 More About JavaScript Objects ........................................................80 IntroducingXMLHTTPRequest..............................................................82 Creating the XMLHTTPRequestObject................................................83 Summary............................................................................................90 Contents v 9 Talking with the Server 91 Sending the Server Request ..............................................................91 Monitoring Server Status ..................................................................97 The Callback Function......................................................................99 Summary..........................................................................................101 10 Using the Returned Data 102 TheresponseTextandresponseXMLProperties..............................102 Another Useful JavaScript DOM Property......................................107 Parsing responseXML........................................................................108 Providing User Feedback................................................................109 Summary..........................................................................................111 11 Our First Ajax Application 112 Constructing the Ajax Application..................................................112 The HTML Document ....................................................................112 Adding JavaScript............................................................................114 Putting It All Together ....................................................................118 Summary..........................................................................................122 PART III More Complex Ajax Technologies 12 Returning Data as Text 123 Getting More from the responseTextProperty..............................123 Summary..........................................................................................130 13 AHAH—Asynchronous HTML and HTTP 131 Introducing AHAH..........................................................................131 Creating a Small Library for AHAH ..............................................132 Using myAHAHlib.js......................................................................135 Summary..........................................................................................141 vi Sams Teach Yourself Ajax in Ten Minutes 14 Returning Data as XML 142 Adding the “x”to Ajax....................................................................142 TheresponseXMLProperty..............................................................143 Project—An RSS Headline Reader ................................................148 Summary..........................................................................................156 15 Web Services and the REST Protocol 157 Introduction to Web Services..........................................................157 REST—Representational State Transfer ........................................158 Using REST in Practice ..................................................................160 REST and Ajax................................................................................165 Summary..........................................................................................165 16 Web Services Using SOAP 166 Introducing SOAP (Simple Object Access Protocol)......................166 The SOAP Protocol ........................................................................167 Using Ajax and SOAP ....................................................................170 Reviewing SOAP and REST ..........................................................172 Summary..........................................................................................172 17 A JavaScript Library for Ajax 173 An Ajax Library ..............................................................................173 Reviewing myAHAHlib.js ..............................................................174 Implementing Our Library..............................................................175 Using the Library ............................................................................179 Extending the Library......................................................................182 Summary..........................................................................................183 18 Ajax “Gotchas” 184 Common Ajax Errors ......................................................................184 The Back Button..............................................................................184 Bookmarking and Links..................................................................185 Telling the User That Something Is Happening..............................186 Making Ajax Degrade Elegantly ....................................................186 Dealing with Search Engine Spiders ..............................................187 Pointing Out Active Page Elements................................................188 Don’t Use Ajax Where It’s Inappropriate........................................189 Security............................................................................................189 Contents vii Test Code Across Multiple Platforms..............................................189 Ajax Won’t Cure a Bad Design ......................................................190 Some Programming Gotchas ..........................................................190 Summary..........................................................................................192 PART IV Commercial and Open Source Ajax Resources 19 The prototype.js Toolkit 193 Introducing prototype.js..................................................................193 WrappingXMLHTTPRequest—theAjaxObject ................................196 Example Project—Stock Price Reader............................................199 Summary..........................................................................................202 20 Using Rico 203 Introducing Rico..............................................................................203 Rico’s Other Interface Tools............................................................208 Summary..........................................................................................214 21 Using XOAD 215 Introducing XOAD..........................................................................215 XOAD HTML..................................................................................219 Advanced Programming with XOAD..............................................222 Summary..........................................................................................223 Index 224 About the Author Phil Ballard graduated in 1980 with an honors degree in electronics from the University of Leeds,England. Following an early career as a research scientist with a major multinational,Phil spent a few years in commercial and managerial roles within the high technology sector,later working full time as a software engineering consultant. Operating as “The Mouse Whisperer”(http://www.mousewhisperer. co.uk),Phil has spent recent years involved solely in website and intranet design and development for an international portfolio of clients. Another of his websites,http://www.crackajax.net,is home to an active and fast- growing Ajax programming community. Phil is currently based in southeast England. In his spare time,he still plays bass guitar in rock bands,despite being easily old enough to know better. Dedication To Sue,for her endless patience and support during the writing of this book—and at all other times,too. Acknowledgments I would like to offer my sincere thanks for the team at Sams Publishing, especially Linda Harrison,Shelley Johnston,Damon Jordan,Seth Kerney, Geneil Breeze,and Andrea Bledsoe. Bill Bercik deserves special thanks,not only for his excellent work as technical editor,but also for his article at http://www.webpasties.com that inspired my interest in Ajax in the first place. I would also like to express my gratitude to the countless individuals who have shared their knowledge and skill by writing open source software, Internet articles,and tutorials. Without their contributions,this book,and a great deal else,would not have been possible.