Ext JS 4 Web Application Development Cookbook

Table of Contents

• Preface

• Chapter 1: Classes, Object-Oriented Principles and Structuring your Application
• Introduction
• Creating custom classes using the new Ext JS class system
• Using inheritance in your classes
• Adding mixins to your class
• Scoping your functions
• Dynamically loading Ext JS classes
• Aliasing your components
• Accessing components with component query
• Extending Ext JS components
• Overriding Ext JS' functionality

• Chapter 2: Manipulating the Dom, Handling Events, and Making AJAX Requests
• Introduction
• Selecting DOM elements
• Traversing the DOM
• Manipulating DOM elements
• Creating new DOM elements
• Handling events on elements and components
• Delegating event handling of child elements
• Simple animation of elements
• Custom animations
• Parsing, formatting, and manipulating dates
• Loading data with AJAX
• Encoding and decoding JSON data

• Chapter 3: Laying Out Your Components
• Introduction
• Using a FitLayout to expand components to fill their parent
• Creating flexible vertical layouts with VBoxes
• Creating flexible horizontal layouts with HBoxes
• Displaying content in columns
• Collapsible layouts with accordions
• Displaying stacked components with CardLayouts
• Anchor components to their parent's dimensions
• Creating fullscreen applications with the BorderLayout
• Combining multiple layouts

• Chapter 4: UI Building Blocks—Trees, Panels, and Data Views
• Introduction
• Loading a tree's nodes from the server
• Sorting tree nodes
• Dragging-and-dropping nodes within a tree
• Using a tree as a menu to load content into another panel
• Docking items to panels' edges
• Displaying a simple form in a window
• Creating a tabbed layout with tooltips
• Manipulating a tab panel's TabBar
• Executing inline JavaScript to in an XTemplate customize appearance
• Creating Ext.XTemplate member functions
• Adding logic to Ext.XTemplates
• Formatting dates within an Ext.XTemplate
• Creating a DataView bound to a data store
• Displaying a detailed window after clicking a DataView node

• Chapter 5: Loading, Submitting, and Validating Forms
• Introduction
• Constructing a complex form layout
• Populating your form with data
• Submitting your form's data
• Validating form fields with VTypes
• Creating custom VTypes
• Uploading files to the server
• Handling exception and callbacks

• Chapter 6: Using and Configuring Form Fields
• Introduction
• Displaying radio buttons in columns
• Populating CheckboxGroups
• Dynamically generate a CheckboxGroup from JSON
• Setting up available date ranges in Date fields
• Loading and parsing Dates into a Date field
• Entering numbers with a Spinner field
• Sliding values using a Slider field
• Loading server side data into a combobox
• Autocompleting a combobox's value
• Rendering the results in a combobox
• Rich editing with an HTML field
• Creating repeatable form fields and fieldsets
• Combining form fields

• Chapter 7: Working with the Ext JS Data Package
• Introduction
• Modeling a data object
• Loading and saving a Model using proxies
• Loading cross-domain data with a Store
• Associating Models and loading nested data
• Applying validation rules to Models' fields
• Grouping a Store's data
• Handling Store exceptions
• Saving and loading data with HTML5 Local Storage

• Chapter 8: Displaying and Editing Tabular Data
• Introduction
• Displaying simple tabular data
• Editing grid data with a RowEditor
• Adding a paging toolbar for large datasets
• Dealing with large datasets with an infinite scrolling grid
• Dragging-and-dropping records between grids
• Creating a grouped grid
• Custom rendering of grid cells with TemplateColumns
• Creating summary rows aggregating the grid's data
• Displaying full-width row data with the RowBody feature
• Adding a context menu to grid rows
• Populating a form from a selected grid row
• Adding buttons to grid rows with action columns

• Chapter 9: Constructing Toolbars with Buttons and Menus
• Introduction
• Creating a split button
• Working with context menus
• Adding a combobox to a toolbar to filter a grid
• Using the color picker in a menu

• Chapter 10: Drawing and Charting
• Introduction
• Drawing basic shapes
• Applying gradients to shapes
• Drawing paths
• Transforming and interacting with shapes
• Creating a bar chart with external data
• Creating a pie chart with local data
• Creating a line chart with updating data
• Customizing labels, colors, and axes
• Attaching events to chart components
• Creating a live updating chart bound to an editable grid

• Chapter 11: Theming your Application
• Introduction
• Compiling SASS with Compass
• Introduction to SASS
• Using Ext JS' SASS variables
• Using the UI config option
• Creating your own theme mixins
• Restyling a panel
• Creating images for legacy browsers

• Chapter 12: Advanced Ext JS for the Perfect App
• Introduction
• Advanced functionality with plugins
• Architecting your applications with the MVC pattern
• Attaching user interactions to controller actions
• Creating a real-life application with the MVC pattern
• Building your application with Sencha's SDK tools
• Getting started with Ext Direct
• Loading and submitting forms with Ext Direct
• Handling errors throughout your application

• Index