"Charting the Course ...

... to Your Success!"

Developing Applications v1.0

Course Summary

Description

This course introduces the Ajax programming model for web applications. We start with a tour of basic browser programming, using JavaScript, the HTML DOM, and CSS. Then, students learn how to establish communication between their on-page and server-side application components, and thus to develop richer, more user-friendly and responsive web applications.

We pursue Ajax connectivity entirely from the client side in this course, and at several levels. From an initial study of the bare-bones approach using the XMLHttpRequest browser object, we move on to consider programming techniques for thread safety, and use of higher-level script libraries such as Prototype and Dojo.

Objectives At the end of this course, students will be able to:

Use JavaScript in web pages to respond to user events. Manipulate an HTML page dynamically using the DOM. Make HTTP requests to the server side of an application from JavaScript, without causing the browser to reload the page. Use script libraries such as Prototype and Dojo to simplify coding tasks and improve UI functionality.

Topics

Overview of Ajax JavaScript The Document Object Model Cascading Style Sheets Making Remote Requests Prototype & Co. Dojo

Audience

This course is intended for software developers, and some programming experience is assumed. Familiarity with basic HTML constructs is required

Prerequisites

Prior knowledge of JavaScript, CSS, or the HTML DOM will be helpful, but no such knowledge is required.

Duration

Three days

Due to the nature of this material, this document refers to numerous hardware and software products by their trade names. References to other companies and their products are for informational purposes only, and all trademarks are the properties of their respective companies. It is not the intent of ProTech Professional Technical Services, Inc. to use any of these names generically

PT8075_DEVELOPINGAJAXAPPLICATIONSV10.DOC

"Charting the Course ...

... to Your Success!"

Developing Ajax Applications v1.0

Course Outline

I. Overview of Ajax V. Making Remote Requests A. What is Ajax? A. iFrames vs. XMLHttpRequest B. Desktop vs. Browser-Based Applications B. Getting an XHR Instance . Page Request/Response Issues C. XHR Methods and Properties . The XMLHttpRequest Object D. Synchronous vs. Asynchronous E. Ajax Processing E. Data Formats F. Client-Side Frameworks F. Extensible Markup Language (XML) G. Server-Side Frameworks G. Receiving XML H. Criticism of Ajax H. Building and Sending XML I. JavaScript Object Notation (JSON) II. JavaScript A. Syntax VI. Prototype & Co. B. Variables A. Client-Side Frameworks C. Data Types B. Script Libraries D. Arithmetic and String Operators C. Ajax Issues E. Conditionals and Loops D. Prototype F. Logical and Comparison Operators E. A Review of prototype.js G. Functions F. Ajax.Request H. Variables Scope G. The Options Object I. Objects and Encapsulation H. The $ Function J. Constructors I. Other Convenience Functions K. Prototypes J. String Functions L. Closures K. Algorithmic Programming M. Arrays VII. Dojo III. The Document Object Model A. The Dojo Toolkit A. The Document Object Model B. Architecture B. The DOM Node Tree C. Dojo C. The Document and Window Objects D. Simplified DOM Manipulation D. Elements E. dojo.xhrGet and dojo.xhrPost E. Attributes F. Response Content Types F. Text Nodes G. The Dojo Event System G. Walking the Tree H. Event Registration H. DOM Events I. Disconnecting Event Handlers I. Modifying the DOM J. Chaining Event Handlers J. Using innerHTML K. The Dojo Widget System L. Built-In Widgets IV. Cascading Style Sheets M. Custom Widgets A. Styling an Element N. Drag-and-Drop Support B. Cascading Styles C. Elements, Classes, and IDs VIII. Appendix A. Learning Resources D. The Box Model E. CSS2 Positioning F. Controlling Visibility

Due to the nature of this material, this document refers to numerous hardware and software products by their trade names. References to other companies and their products are for informational purposes only, and all trademarks are the properties of their respective companies. It is not the intent of ProTech Professional Technical Services, Inc. to use any of these names generically

PT8075_DEVELOPINGAJAXAPPLICATIONSV10.DOC