Please contact us
for GSA pricing.

Contract #

Please see our complete list of Microsoft Official Courses

Ext JS Training: DOM Scripting, Ajax and User Interfaces Using Ext JS

Course Number: SCRPT-115
Duration: 3 days
view course outline

Ext JS Training Overview

Accelebrate's DOM Scripting, Ajax and User Interfaces Using Ext JS training course teaches attendees to use the Ext JS library to simplify many client-side scripting and user interface development challenges. Attendees will learn how to perform Document Object Model (DOM) manipulations that dynamically change the content and appearance of their Web pages, how to make Ajax requests to retrieve and incorporate new content from a server and how to create user interface elements such as tab panels, accordions and editable grids.

Location and Pricing

Most Accelebrate courses are delivered as private, customized, on-site training at our clients' locations worldwide for groups of 3 or more attendees and are custom tailored to their specific needs. Please visit our client list to see organizations for whom we have delivered private in-house training. These courses can also be delivered as live, private online classes for groups that are geographically dispersed or wish to save on the instructor's or students' travel expenses. To receive a customized proposal and price quote for private training at your site or online, please contact us.

In addition, some courses are available as live, online classes for individuals. See a schedule of online courses.

Ext JS Training Prerequisites

Accelebrate's Mastering JavaScript course or equivalent experience. If attendees will not have thorough knowledge of JavaScript, please let us know and we will precede this course with a one-day JavaScript primer.

Hands-on/Lecture Ratio

This Ext JS training class is 60% hands-on, 40% lecture, with the longest lecture segments lasting for 20 minutes. Students "learn by doing," with immediate opportunities to apply the material they learn to real-world problems.

Ext JS Training Materials

All students receive a copy of Manning's Ext JS in Action as well as electronic copies of the class files.

Software Needed on Each Student PC

  • An IDE or text editor that understands JavaScript syntax
  • Web browsers - recent versions of the following:
    • Google Chrome
    • Mozilla Firefox
    • Internet Explorer (for Windows)
    • Safari (for Mac)
  • A recent version of Node.js installed
  • Related lab files will be provided by Accelebrate

Ext JS Training Objectives

  • Incorporate the most recent version of Ext JS into their Web pages.
  • Use adapters to enable Ext JS to work with other libraries.
  • Perform DOM manipulations using the Ext JS DomQuery and DomHelper classes.
  • Initiate Ajax requests with Ext JS and how to handle responses in various formats.
  • Create compelling user interfaces that include tab panels, accordions, data grids and editable grids.

Ext JS Training Outline

  • Extending JS Classes
    • Number, Array and Function
    • Date
    • String
  • The Ext Class
    • Browser and OS Detection
    • Array Manipulation
    • Type Determination
  • DOM Manipulation with Ext JS
    • Don't Jump the Gun: The Ext.onReady() Event Handler
    • Review of Cascading Style Sheet (CSS) Selectors
    • Using Element, Class and ID Selectors
    • Using Custom Ext JS Selectors
    • Modifying the Content and Styles of Selected Elements
    • Selecting elements with DomQuery
    • Adding and Removing Elements Using Ext JS
  • Ajax the Ext JS Way
    • The Gory Details: A Complete Ajax Request with No Library Support
    • GET and POST Requests with Ext JS
    • Incorporating Form Data into Your Ajax Requests
    • Handling Responses in Plain Text, HTML, JSON and XML Formats
  • Working with Data
    • The Flow of Data within Ext JS
    • Proxies
    • Stores
    • Data Grid - Populating from Arrays, JSON and XML
    • Editable Data Grid
    • DataView and GridView
  • Creating User Interfaces
    • Interactive Form Elements
    • Windows and Dialogs
    • Working with Layouts
    • Tab Panel Layout
    • Accordion Layout
    • Tree Panel
    • User Interface Elements
  • Conclusion