Está en la página 1de 11

EXT JS Duration: 3 days @ 8hrs/day_ Day - 1 Getting Started About Ext Ext: Not just another JavaScript library

ry Cross-browser DOM (Document Object Mode Event-driven interfaces Ext and AJAX Getting Ext Where to put Ext Including Ext in your pages What do those files do? Using the Ext library Time for action The example Not working ? Adapters Using adapters asynchronous Localization English only A language other than English Multiple languages Ext JS online community Staples of Ext Spacer image Widget Time for action What just happened? Using onReady More widget wonders Meet JSON and the config object

The old way The new wayconfig objects What is a config object? How does JSON work? Time for action The workhorseExt.get Speed tip Forms The core components of a form Our first form Nice formhow does it work? Form fields Validation Built-in validationvtypes Styles for displaying errors Custom validationcreate your own vtype Maskingdon't press that key! Radio buttons and check boxes It's not a button, it's a radio button X marks the check box The ComboBox Database-driven ComboBox TextArea and HTMLEditor Listening for form field events ComboBox events Buttons and form action Form submission Talking backthe server responses Loading a form with data Static data load Object reference or component config Instantiated Component config

Buttons, Menus, and Toolbars A toolbar for every occasion Toolbars The button Menu Split button Toolbar item alignment, dividers, and spacers Shortcuts Icon buttons Button handlersclick me! Load content on menu item click Form fields in a toolbar Toolbars in windows, grids, and panels Displaying Data with Grids What is a grid anyway? Displaying structured data with a GridPanel Setting up a data store Adding data to our data store Defining your data for the data store Specifying data types Displaying the GridPanel How did that work? Configuring the GridPanel Defining a Grids column model Using cell renderers Formatting data using the built-in cell renderers Creating lookup data storescustom cell rendering Combining two columns Generating HTML and graphics Built-in features Client-side sorting Hidden/visible columns Column reordering

Displaying server-side data in the grid Loading the movie database from an XML file Loading the movie database from a JSON file Loading data from a database using PHP Programming the grid Working with cell and row selections Listening to our selection model for selections Manipulating the grid (and its data) with code Altering the grid at the click of a button Advanced grid formatting Paging the grid Grouping Grouping store Day - 2 Editor Grids What can I do with an editable grid? Working with editable grids Editing more cells of data Edit more field types Editing a date value Edit with a ComboBox Reacting to a cell edit What's a dirty cell? Reacting when an edit occurs Deleting and adding in the data store Removing grid rows from the data store Adding a row to the grid Saving edited data to the server Sending updates back to the server Deleting data from the server Saving new rows to the server Layouts What are layouts, regions, and viewports?

Our first layout Splitting the regions Tab panels Adding a tab panel Widgets everywhere Adding a grid into the tabpanel Accordions Nesting an accordion layout in a tab Placing a toolbar in your layout A form to add new movies Tricks and advanced layouts Nested layouts Icons in tabs Programmatically manipulating a layout Show & Hide Multiple tabs Working with tree structure Preparing the ground A tree can't grow without data JSON A quick word about ID Extra data XML Tending your trees Drag and drop Sorting Editing Trimming and pruning Selection models Round-up with context menus Handling the menu Filtering The roots

TreePanel tweaks Cosmetic Tweaking TreeNode Manipulating Further methods Event capture Table of Contents Remembering state StateManager Caveats Windows and Dialogs Opening a dialog Dialogs Off the shelf Confirmation It's all progressing nicely Roll your own Behavior Windows Starting examples Paneling potential Layout Configuration When I'm cleaning windows The extras Desktopping Further options Framing our window Manipulating Events State handling Window management Default window manager behavior

Multiple window example Customer service WindowGroups Effects It's elementary Fancy features Fxcellent functions Fading Framing ghosting Highlighting Huffing and puffing Scaling the Ext JS heights Switching from seen to unseen Shifting And now, the interesting stuff The Fx is in Anchoring yourself with Ext Options Easy does it Multiple effects Chaining Queuing Concurrency Blocking and Ext.Fx utility methods Elemental Making a move Using Ext components Bring out the flash Masking Data binding and other tales Considering components QuickTipping Day - 3

Drag-and-Drop Drop what you're doing Sourcing a solution Approximating snapping Zones of control Changing our lists Registering an interest Extreme drag-and-drop DataView dragging Dealing with drag data Proxies and metadata Dropping in the details Drag-drop groups It's all in the details Configuration Managing our movement Global properties Scroll management Dragging within components TreePanel GridPanel Using it in the real world It's All about the Data o Understanding data formats o Basic remote panel data o Gotchas with HTML data o Other formats o The data store object o Defining data o More on mapping our data o Pulling data into the store o Using a DataReader to map data

o Using a custom DataReader o Getting what you want: Finding data o Finding data by field value o Finding data by record index o Finding data by record ID o Getting what you want: Filtering data o Remote filtering: The why and the how o Dealing with Recordset changes o Many objects take a Store o Store in a ComboBox o Store in a DataView o Stores in Grids Code for Reuse: Extending Ext JS Object-oriented JavaScript o Object-oriented programming with Ext JS o Inheritance o Break it down and make it simple o Sounds cool, but what does it mean ? o Now, what was this overriding stuff ? o Understanding packages, classes, and namespaces o Packages o Classes o Namespaces o What's next? o Ok, what do we extend ? o Creating a custom namespace o Our first custom class o Overriding methods o Understanding the order of events o When can we do what? o What is an event-driven application? o Creating our own custom events o Our first custom component: Complete

o What's next? Breaking it down o Using xtype: The benefits of lazy instantiation o Using our custom components within other objects The Power of Ext JS: What Else Can You Form widgets DateField TimeField NumberField CheckboxGroups and RadioGroups HtmlEditor Data formatting Basic string formatting Formatting dates Other formatting Managing application state Basic 'state' How do I get that window? Using the back button in Ext JS applications Accessing the DOM Finding DOM elements Manipulating the DOM Working with styles Ext JS for the desktop: Adobe AIR Ext JS community extensions DatePickerPlus PowerWizard TinyMCE SwfUploadPanel ColorPicker Additional resources Samples and demos Ext JS API Ext JS forums

Step-by-step tutorials Community manual Spket IDE Aptana Studio Google

También podría gustarte