You are previewing Ajax: The Definitive Guide.
O'Reilly logo
Ajax: The Definitive Guide

Book Description

Is Ajax a new technology, or the same old stuff web developers have been using for years? Both, actually. This book demonstrates not only how tried-and-true web standards make Ajax possible, but how these older technologies allow you to give sites a decidedly modern Web 2.0 feel. Ajax: The Definitive Guide explains how to use standards like JavaScript, XML, CSS, and XHTML, along with the XMLHttpRequest object, to build browser-based web applications that function like desktop programs. You get a complete background on what goes into today's web sites and applications, and learn to leverage these tools along with Ajax for advanced browser searching, web services, mashups, and more. You discover how to turn a web browser and web site into a true application, and why developing with Ajax is faster, easier and cheaper. The book also explains:

  • How to connect server-side backend components to user interfaces in the browser

  • Loading and manipulating XML documents, and how to replace XML with JSON

  • Manipulating the Document Object Model (DOM)

  • Designing Ajax interfaces for usability, functionality, visualization, and accessibility

  • Site navigation layout, including issues with Ajax and the browser's back button

  • Adding life to tables & lists, navigation boxes and windows

  • Animation creation, interactive forms, and data validation

  • Search, web services and mash-ups

  • Applying Ajax to business communications, and creating Internet games without plug-ins

  • The advantages of modular coding, ways to optimize Ajax applications, and more

This book also provides references to XML and XSLT, popular JavaScript Frameworks, Libraries, and Toolkits, and various Web Service APIs. By offering web developers a much broader set of tools and options, Ajax gives developers a new way to create content on the Web, while throwing off the constraints of the past. Ajax: The Definitive Guide describes the contents of this unique toolbox in exhaustive detail, and explains how to get the most out of it.

Table of Contents

  1. Ajax: The Definitive Guide
    1. SPECIAL OFFER: Upgrade this ebook with O’Reilly
    2. A Note Regarding Supplemental Files
    3. Preface
      1. Who Should Read This Book
        1. Web Developers
        2. Managers
      2. How This Book Is Organized
      3. Conventions Used in This Book
      4. Using Code Examples
      5. How to Contact Us
      6. Safari® Books Online
      7. Acknowledgments
    4. I. Ajax Fundamentals
      1. 1. Reinventing the Web
        1. Web Page Components
          1. Classic Web Components
          2. Ajax
          3. Case Study
            1. The application then
            2. The application now
        2. Modern Web Standards
          1. XHTML
          2. JavaScript
          3. The DOM
          4. Cascading Style Sheets (CSS)
          5. XML
          6. Syndication
            1. RSS
            2. Atom
          7. XSLT
        3. Browsers
          1. Gecko
          2. Trident
          3. KHTML/WebCore
          4. Presto
          5. Others
        4. Standards Compliance
        5. Welcome to Web 2.0
      2. 2. From Web Sites to Web Applications
        1. The Transition
          1. Planning
          2. Design
          3. Implementation
          4. Test and Release
        2. Basic Web and Ajax Design Patterns
          1. Client/Server
          2. Basic Three-Tier
          3. Model-View-Controller
          4. Rich Internet Applications
        3. Application Environments
          1. Intranet
          2. Commercial
          3. Educational
          4. Government
          5. Specific Content
        4. The Developer
        5. What Ajax Is Not
      3. 3. Servers, Databases, and the Web
        1. The Web Server
          1. CGI
          2. FastCGI
          3. Servlets
          4. SSI
        2. Server-Side Scripting
          1. ASP/ASP.NET
          2. PHP
          3. Python
          4. Ruby
          5. Java
        3. Databases
          1. Oracle
          2. Microsoft SQL Server
          3. IBM DB2
          4. Open Source Databases: MySQL and PostgreSQL
          5. Nonrelational Database Models
        4. Getting Data Into and Out of Relational Databases
        5. Interfacing the Interface
        6. Frameworks and Languages
          1. The .NET Framework
          2. Ruby on Rails
          3. Java Frameworks
            1. Jakarta Struts
            2. Spring
            3. Tapestry
          4. Python Frameworks
            1. Django
            2. Zope
          5. PHP Frameworks
            1. CakePHP
            2. Zoop
            3. Zend
        7. What Good Are Frameworks?
      4. 4. Foundations: Scripting XML and JSON
        1. XML
          1. XML Requests and Responses
          2. Parsing
          3. XML in a String
          4. XPath
          5. XSLT
        2. JSON
          1. JSON Requests and Responses
          2. Parsing
        3. Choosing a Data Exchange Format
        4. A Quick Introduction to Client Frameworks
          1. The Dojo Toolkit
          2. Prototype
            1. script.aculo.us
            2. moo.fx
          3. DWR
          4. jQuery
          5. Sarissa
          6. Others
        5. Simplifying Development
          1. Prototype Helper Functions
          2. Prototype and Ajax
      5. 5. Manipulating the DOM
        1. Understanding the DOM
        2. We've Already Met
        3. Manipulating DOM Elements, Attributes, and Objects
          1. Creating Elements, Attributes, and Objects
          2. Modifying and Removing Elements, Attributes, and Objects
          3. Element, Attribute, and Object Information
          4. Walking the DOM
        4. Change That Style
          1. Modifying and Removing Style
          2. Style Information
          3. What About Internet Explorer?
        5. Events in the DOM
          1. Creating Events
          2. Initializing, Firing, Adding, and Removing Events
          3. Event Information
          4. What About Internet Explorer? Part II
        6. DOM Stuff for Tables
        7. Is innerHTML Evil?
      6. 6. Designing Ajax Interfaces
        1. Usability
          1. What Can Go Wrong?
            1. Bloat, bloat, bloat
            2. Poor focus
            3. Obscurity
            4. Lack of navigation
            5. Expecting too much from your end users
            6. Web reading style
          2. Principles for the Ajax Web
            1. Minimalist and aesthetic structure
            2. Flexibility and efficiency
            3. Consistency
            4. Navigation
            5. Feedback
            6. Documentation and help
        2. Functionality
          1. Common Web Tools
          2. Tools in a Desktop Application
          3. What Can Be Done?
        3. Visualization
          1. Layout
          2. Fonts
          3. Images and Icons
        4. Accessibility
          1. W3C-WAI
          2. Is This Important?
          3. Ajax Accessibility Issues
          4. When All Else Fails
        5. The Ajax Interface
    5. II. Ajax Foundations
      1. 7. Laying Out Site Navigation
        1. Menus
          1. Simple Navigation Bar
          2. Button and Image Navigation
            1. Advanced buttons
            2. Image rollovers the Ajax way
          3. Drop-Down Menus
          4. The File Menu
            1. Adding Ajax to the menu
        2. Tabs
          1. CSS to the Rescue
          2. Image Tabs
          3. The Tab Content
        3. Navigation Aids
          1. Breadcrumbs
          2. Links at the Bottom
          3. Paged Navigation
          4. Navigation Boxes
            1. Trees, trees, trees
            2. Vertical lists
          5. Accordion Navigation
          6. Ajax and Page Loading
        4. Problems with Ajax Navigation
          1. Bookmarks
          2. The Browser's Back Button
        5. General Layout
      2. 8. Fun with Tables and Lists
        1. Layout Without Tables
          1. Old Layouts
          2. Using CSS
        2. Accessible Tables
          1. Interacting with Tables
          2. Ajax and Tables
        3. Sorting Tables
          1. JavaScript Sorting
          2. Sorting with Ajax
          3. And the Winner Is...
        4. Tables with Style
          1. Keeping Style with Sorts
        5. Table Pagination
          1. Making Pages with JavaScript
          2. Ajax Table Pagination
          3. Sorting Paginated Tables
        6. Lists 2.0
          1. What We've Already Seen
        7. Lists for All Seasons
          1. Table of Contents
          2. Sortable Lists
          3. Ajax and the Draggable List
          4. An Ajax Slide Show
      3. 9. Page Layout with Frames That Aren't
        1. Using Frames
          1. The Frameset and Frame
          2. The iframe Craze
        2. XHTML and Frames
          1. The Deprecated Ones
          2. If Frames Are a Must
          3. Using iframes As Frames
        3. The Magic of Ajax and a DIV
          1. Laying Out the "Frame"
          2. Inserting Content
        4. Page Layout
          1. Think About Being Dynamic
          2. The Proven Theory
          3. Let CSS Be Your Guide
      4. 10. Navigation Boxes and Windows
        1. The Alert Box
        2. Integrating the Window
          1. The Window Style
          2. Moving the Window
        3. Navigation Windows
          1. Placing Content into Windows
          2. Information Boxes
          3. Replacing Alerts, Prompts, Confirms, and So On
        4. Tool Tips
        5. The Necessary Pop Up
      5. 11. Customizing the Client
        1. Browser Customizations
          1. Stylesheets
          2. Font Sizes
          3. Character Encoding
        2. Stylesheet Switching
          1. Creating the Stylesheets
          2. Alternate Stylesheets
          3. The Switching Object
          4. Remembering the User's Selection
        3. Switching Different Customizations
        4. Easy Font-Size Switching
          1. Using Relative Sizes
          2. The Font CSS
          3. A Font-Size Slider Bar
        5. Creating Color Themes
          1. Remember the Zen
          2. The Rest Is the Same
        6. Throwing Ajax into the Mix
          1. Preparing the Structure for Change
          2. Arrays to Store Ever-Changing Information
        7. Changing Site Language with Ajax
          1. The JSON to Send
          2. Switching Out the Data
          3. A Faster Alternative?
        8. Repositioning Objects and Keeping Those Positions
          1. Dragging Objects Around
          2. Storing Information in a Database
          3. Sending Changes with Ajax
        9. Storing It All in the Database
      6. 12. Errors: To Be (in Style) or Not to Be
        1. Error Handling on the Web
          1. JavaScript Errors
          2. Server-Side Errors
            1. Server scripting errors
            2. Database errors
            3. External errors
        2. Should I React to That Error?
          1. Trapping an Error
            1. try...catch...finally
            2. Throwing an error
            3. Ajax gone wrong
          2. Ignorable Errors
          3. Hold It Right There!
        3. Handling an Error with Care
          1. Notifying the User
          2. Emailing the Developer
          3. Logging to a Database
        4. Integrating the User Error
          1. Following Site Design
          2. User Instructions for the Error
      7. 13. This Ain't Your Father's Animation
        1. Animation on the Web
          1. The History of the GIF Format
          2. How Does It Work?
            1. The file structure
            2. Palettes
        2. What Is Wrong with GIF?
          1. Color Depth
          2. Alpha Transparency
        3. Building Animation with the PNG Format
          1. What Is Different About a PNG?
          2. The PNG CSS
          3. JavaScript Looping
          4. Putting It All Together
          5. Adding Ajax to Our Animations
        4. Ajax Animations
          1. Frameworks Are the Way to Go
          2. Dragging and Dropping
            1. The script.aculo.us objects
            2. Dojo Toolkit dragging
            3. Dragging with other frameworks
          3. Moving Objects
            1. How frameworks do it
          4. Other Animations on the Web
            1. Object manipulations
            2. Drawing libraries
      8. 14. A Funny Thing Happened on the Way to the Form
        1. XHTML Forms
          1. Form Elements
          2. Accessible Forms
            1. Accessibility
            2. Usability
        2. Using JavaScript
          1. Getting Form Values
            1. Simplicity with Prototype
        3. Fancier Forms
          1. CSS and Forms
            1. More functional radio buttons and checkboxes
            2. Fake drop downs
          2. Using Libraries and Toolkits
            1. Dojo
            2. Zapatec
        4. The Basics of Ajax and Forms
          1. GET/POST Form Data Without Using the Form Submit
        5. Accepting Ajax-Delivered Data
          1. GET/POST/RAW POST
          2. Email Form Data
          3. Saving Form Data in a Database
          4. Getting File Uploads
          5. Sending Data Back to the Client
        6. Server Responses
          1. Reporting Success/Failure
          2. Handling Other Server Responses
      9. 15. Data Validation: Client, Server, or Both
        1. Data Validation Is Important
        2. Validation with JavaScript
          1. Value Checking
          2. Using Regular Expressions
          3. Specialized Data Checking
            1. Phone numbers
            2. Email addresses
            3. Social Security numbers
            4. Credit cards
          4. A Validation Object
          5. Using Libraries to Validate
        3. CSS Notification of Errors
          1. CSS Error Rules
          2. JavaScript Rule Switching
        4. Validation on the Server
          1. Did We Get What We Expected?
          2. Protecting the Database
          3. Value Checking on the Server
          4. Returning Problems
        5. Ajax Client/Server Validation
          1. On-the-Fly Checking
          2. Client and Server Checking in One
    6. III. Ajax in Applications
      1. 16. Search: The New Frontier
        1. Types of Site Searches
          1. Keyword Searching
          2. Full Text Parsing
          3. Page Indexing
            1. Database searching
          4. Search Engines for Local Use
          5. Advanced Searching
        2. Dynamic Searching with Ajax
          1. Giving Hints
          2. Sending Results to the Client
        3. Googling a Site
          1. Google's AJAX Search API
            1. GSearchControl
            2. GSearchForm
            3. GwebSearch
          2. Using Google's AJAX Search API
            1. GwebResult
          3. Displaying Results
            1. The response
            2. Site formatting
      2. 17. Introducing Web Services
        1. What Is a Web Service?
        2. Web Service Architectures
          1. Remote Procedure Call
          2. Service-Oriented Architecture
          3. Web Service Standards
            1. SOAP
            2. Web Services Description Language
            3. Universal Discovery, Description, and Integration
          4. Representational State Transfer
        3. Ajax and Web Services
          1. Client Requests
          2. Server-Side Scripting to Services
          3. Gathering the Data
          4. Sending the Web Service Response
        4. Web Feeds
          1. Scraping
          2. Syndication
            1. RSS and Atom
          3. Feed Validation
        5. Web Service APIs
      3. 18. Web Services: The APIs
        1. Publicly Available Web Services
          1. Blogging Services
          2. Bookmark Services
          3. Financial Services
          4. Mapping Services
          5. Music/Video Services
          6. News/Weather Services
          7. Photo Services
          8. Reference Services
          9. Search Services
          10. Shopping Services
          11. Other Services
        2. Ajax and the API
          1. XMLHttpRequest and the Web Service
        3. The Next Step with Services
      4. 19. Mashups
        1. Mashups in Web 2.0 Applications
        2. What Are Mashups?
          1. A Brief History
        3. Mashups As Applications
          1. Pitfalls and Travails
            1. Just because
            2. Clutter
            3. Cohesiveness
            4. Reinventing the wheel
          2. What Mashups Can Do
        4. Data Sources
          1. Public Data
            1. Public records
            2. Background check records
            3. Business records
            4. People searches
          2. Open Source Services
        5. Application Portlets
        6. Building a Mashup
          1. Choose a Subject
          2. Select Data Sources
          3. Decide on the Backend
          4. Code It
        7. Mashups and Business
      5. 20. For Your Business Communication Needs
        1. Businesses and Ajax
          1. Reducing Costs
          2. Easing Installation
        2. Real-Time Communication
          1. Client/Server Communication
          2. Connecting to Chat
          3. The Chat Client
          4. The Chat Server
        3. File Sharing
          1. Sending a File
          2. File Notification
          3. Receiving the File
        4. Whiteboards
          1. The Board
            1. Using an existing library
            2. Collecting mouse movements
            3. Drawing on the board
          2. Communication
            1. Sending the mouse movements
            2. Drawing on other boards
          3. Enhancing the Board
            1. Pen colors
            2. Stamps and shapes
        5. Combining Applications
      6. 21. Internet Games Without Plug-ins
        1. Gaming on the Web
          1. First-Person Shooters
          2. Strategy Games
            1. Abstract
            2. Real-time
            3. Turn-based, economic, and God-like
          3. Adventure Games
          4. Role-Playing Games
            1. Massive multiplayer online role-playing games
          5. Puzzle Games
          6. Arcade Games
          7. Other Games
        2. Internet Requirements
          1. Plug-ins
            1. Flash
            2. Shockwave
            3. Java applets
          2. Game Development with Ajax
        3. Animating a Character
          1. Creating the Walking Loop
          2. Moving the Character
            1. Static directions
            2. Dynamic directions
        4. Basic Collisions
          1. Rectangular Collision Detection
          2. Circular Collision Detection
          3. Linear Collision Detection
        5. User Input
          1. Keyboard Input
          2. Mouse Input
        6. The Basics of Event Handling
          1. Handling User Input
          2. Starts and Stops
          3. Changes in Direction
          4. Collisions
          5. Receiving Data
        7. Putting It All Together
    7. IV. Wrapping Up
      1. 22. Modular Coding
        1. What Is Modular Coding?
        2. The Client Side
          1. XHTML
            1. Components of the page
            2. Smaller pieces are better
          2. CSS
            1. Style properties
            2. Media types
          3. JavaScript
            1. Functionality
            2. Page-specific components
        3. The Server Side
          1. Using the Server Side for Structure
          2. Modularizing SQL
          3. Server-Side Components
      2. 23. Optimizing Ajax Applications
        1. Site Optimization Factors
          1. Size
          2. Execution Speed
        2. HTTP
          1. HTTP Headers
          2. HTTP Compression
        3. Packets
          1. Optimal Sizes
        4. Client-Side Optimizations
          1. XHTML and CSS
            1. Size reduction
          2. JavaScript
            1. Size reduction
            2. Code speed enhancements
        5. Server-Side Optimizations
          1. Compression
          2. SQL Optimization
            1. Inline queries
            2. Stored procedures
        6. Ajax Optimization
          1. Communication
          2. Data
          3. Code Optimization
    8. V. References
      1. A. The XML and XSLT You Need to Know
        1. What Is XML?
        2. Anatomy of an XML Document
          1. Elements and Attributes
          2. Name Syntax
          3. XML Namespaces
          4. Well Formed
          5. Comments and Processing Instructions
          6. Entity References
          7. Character References
          8. Character Encodings
            1. Unicode encoding schemes
            2. Other character encodings
          9. Validity
            1. DTDs
            2. Connecting DTDs to documents
        3. Extensible Stylesheet Language Transformation
          1. The Progression of XSL
          2. The Stylesheet
            1. Document declaration
          3. XSLT Elements
            1. <xsl:template>
            2. <xsl:text>
            3. <xsl:value-of>
            4. <xsl:for-each>
            5. <xsl:if>
            6. <xsl:apply-templates>
            7. The standard elements
            8. Using functions
      2. B. JavaScript Framework, Toolkit, and Library References
        1. Prototype Framework Reference
          1. Ajax with Prototype
          2. Ajax Response Callbacks
          3. Passing Parameters to the HTTP Method
          4. Evaluating JSON
          5. The Global Responders
          6. Dynamic Page Updating
          7. Automating Requests
        2. script.aculo.us Library Reference
          1. Auto-Completion
            1. Ajax.Autocompleter
            2. Autocompleter.Local
            3. Autocompleter.Base
          2. Inline Editing
            1. Ajax.InPlaceEditor
            2. Ajax.InPlaceCollectionEditor
          3. Effects
        3. Rico Library Reference
          1. Ajax with Rico
          2. The Response
          3. Handling Responses
          4. Effects
        4. MooTools Library Reference
          1. Simple Server Requests
          2. Making an Ajax Request
          3. Form Submission
          4. Effects
        5. Dojo Toolkit Reference
          1. dojo.io.bind
          2. Handling Results
          3. JSON and Dot Notation
          4. Sending Form Data
          5. The Rest of Dojo
        6. Sarissa Library Reference
          1. Sarissa's Ajax Request
          2. Parsing Data
          3. Sarissa and XML
        7. MochiKit Library Reference
          1. MochiKit.Async
          2. Ajax in MochiKit
          3. The Rest of MochiKit
        8. jQuery Library Reference
          1. Ajax with jQuery
          2. Other jQuery Functionality
      3. C. Web Service API Catalog
      4. D. Ajax Risk References
        1. Requirements
        2. Bookmarking Issues
        3. Back and Forward Button Problems
        4. Security Risks
        5. Search Engines
        6. Accessibility
        7. Content Changes
    9. Index
    10. About the Author
    11. Colophon
    12. SPECIAL OFFER: Upgrade this ebook with O’Reilly