Ajax Training (JSC401)
In this Ajax training class, students learn to make calls to the server with JavaScript and to manipulate JSON and XML content returned from the server. Ajax opens the door to creating sophisticated web-based applications with much more of the logic (and therefore code) handled on the client. While Ajax allows for more dynamic and responsive applications, it changes the traditional role of JavaScript dramatically and forces developers to rethink how they write and manage JavaScript code. After taking this Ajax training course, students will be able to create sophisticated Ajax-based applications in an efficient and modular way.
The server-side aspects of this class are written in Node.js so that students using any type of operating system (Windows, Mac, Linux) can run the code from their own computer. While it's helpful to understand the server side, it's not required or assumed; a short overview of the Node.js server features (written in JavaScript) are included with the course, for those interested.
For private groups new to CSS, XML, XSLT, and/or JavaScript, this Ajax training course can be customized to include accelerated introductions to those technologies.
This Ajax course has been updated for HTML5 and includes content on accessing remote data with Ajax via both Cross-Origin Resource Sharing (CORS) and JSONP (JSON with Padding).
- Learn how Ajax and the XMLHttpRequest object work.
- Learn to write cross-browser Ajax code.
- Learn to use Ajax to make a call to the server without a page refresh.
- Learn to modify content blocks on a page without refreshing the whole page.
- Learn to use server-side form validation with Ajax.
- Learn to pull down content from the server to dynamically display more content.
- Learn to manipulate XML documents with JavaScript using the DOM.
- Learn to use the jQuery JavaScript library to simplify and streamline Ajax coding.
- Learn to perform Ajax calls to external sites using both CORS and JSONP.
- Learn how the Node.js framework can be used to provide platform-agnostic server-side resources.
- A Quick Overview of Web Development
- Client-side Programming
- HTML
- Cascading Style Sheets
- JavaScript
- Dynamic HTML
- Ajax
- Adobe Flash
- Server-side Programming
- Perl
- ColdFusion
- Active Server Pages
- Java EE
- ASP.NET
- PHP
- Ruby on Rails
- Client-side Programming
- Intro to Ajax and the Node.js Server
- The Purpose of Ajax
- Traditional Web Application
- JavaScript on the Server Side?
- Why Node.js?
- Installing Node.js
- Running Node.js
- A First Node.js Application & Server
- An Ajax Web Application
- Exercise: Adding a New Route to a Node.js Application
- The Purpose of Ajax
- Ajax Basics
- The XMLHttpRequest Object
- Using an XMLHttpRequest Object
- Handling the Response
- Exercise: Ajax Using the POST Method
- The Callback Function
- Exercise: Displaying and Updating Records
- The XMLHttpRequest Object
- jQuery
- jQuery: A JavaScript Library
- About jQuery
- jQuery Basics
- Ajax with jQuery
- jQuery's Ajax-Related Methods
- Convenience Methods
- $.fn.load
- Exercise: Displaying Customer List in a Table with jQuery
- jQuery: A JavaScript Library
- Passing Data
- XML
- Creating an addChild() Function
- Exercise: Using addChild()
- Dynamic Tables
- Exercise: Handling responseXML
- JSON
- Review of Object Literals
- Arrays
- Objects
- Arrays in Objects
- Objects in Arrays
- Back to JSON
- JSON Syntax
- JSON Parsers
- Exercise: Using JSON
- JSON Advantages and Disadvantages
- XML
- Ajax Applications
- Login Form
- Quick Lookup Form
- Exercise: Creating a Simple Lookup Form
- Preloaded Data
- Ajax Slideshow
- Navigable Tables
- Exercise: Create Navigable Table Rows
- More Ajax Applications
- Inline Editing
- The contenteditable Attribute
- Exercise: Using contenteditable for Inline Editing
- Detailed Information on Demand
- Autologout
- Autocompletion
- Inline Editing
- CORS/JSONP
- CORS/JSONP: Accessing Remote Sites
- CORS
- Exercise: Retrieving Country Info from GeoNames via CORS
- JSONP
- Exercise: Retrieving State Names from Yahoo! with JSONP
- CORS Vs. JSONP Differences
- CORS/JSONP: Accessing Remote Sites
Each student will receive a comprehensive set of materials, including course notes and all the class examples.
Experience in the following is required for this class:
- HTML
- JavaScript
- CSS
Courses that can help you meet these prerequisites: