海外事业部前台开发培训资料--ExtJS入门.pptVIP

一、ExtJS----类库 一、ExtJS----类库 ExtJS组件分类 组件大致可以分成三大类，即基本组件、工具栏组件、表单及元素组件。有近40种组件,从组件的xtype、所属类、描述三个方面了解ExtJS3.X组件大概了解。 一、ExtJS----基本组件 xtype Class 描述 box Ext.BoxComponent 具有边框属性的组件 button Ext.Button 按钮 colorpalette Ext.ColorPalette 调色板 component Ext.Component 组件 container Ext.Container 容器 cycle Ext.CycleButton 可自动循环的分隔按钮 dataview Ext.DataView 数据显示视图 datepicker Ext.DatePicker 日期选择面板 editor Ext.Editor 编辑器 editorgrid Ext.grid.EditorGridPanel 可编辑的表格 grid Ext.grid.GridPanel 表格 paging Ext.PagingToolbar 工具栏中的间隔 panel Ext.Panel 面板 progress Ext.ProgressBar 进度条 splitbutton Ext.SplitButton 可分裂的按钮 tabpanel Ext.TabPanel 选项面板 treepanel Ext.tree.TreePanel 树 viewport Ext.ViewPort 视图 window Ext.Window 窗口 一、ExtJS----工具栏组件 xtype Class 描述 toolbar Ext.Toolbar 工具栏 tbbutton Ext.Toolbar.Button 按钮 tbfill Ext.Toolbar.Fill 文件 tbitem Ext.Toolbar.Item 工具条项目 tbseparator Ext.Toolbar.Separator 工具栏分隔符 tbspacer Ext.Toolbar.Spacer 工具栏空白 tbsplit Ext.Toolbar.SplitButton 工具栏分隔按钮 tbtext Ext.Toolbar.TextItem 工具栏文本项 一、ExtJS----工具栏组件 xtype Class 描述 form Ext.FormPanel 表单面板 checkbox Ext.form.Checkbox 复选框 combo Ext.form.ComboBox 下拉选择框 datefield Ext.form.DateField 日期选择项 field Ext.form.Field 表单字段 fieldset Ext.form.FieldSet 表单字段集 hidden Ext.form.Hidden 表单隐藏域 htmleditor Ext.form.HtmlEditor html编辑器 numberfield Ext.form.NumberField 数字编辑器 radio Ext.form.Radio 单选按钮 textarea Ext.form.TextArea 区域文本框 textfield Ext.form.TextField 表单文本框 timefield Ext.form.TimeField 时间录入项 trigger Ext.form.TriggerField 触发录入项 一、ExtJS----创建ExtJS组件 组件直接通过new关键字来创建，比如创建一个窗口，使用new Ext.Window()，创建一个表格则使用new Ext.GridPanel()。 组件的构造函数中一般都包含一个对象，这个对象包含创建该组件所需要的配置属性及值，组件根据构造函数中的参数属性值来初始化组件本身。如下面的例子 一、ExtJS----创建ExtJS组件 每一个组件除了继承基类中的配置属性以外，还会根据需要增加自己的配置属性，另外子类中有的时候还会把父类的一些配置属性的含义及用途重新定义。学习及使用ExtJS，其中最关键的是掌握ExtJS中的各个组件的配置属性及具体的含义，这些配置属性在下载下来的ExtJS源码文档中都有详细的说明，可以通过这个文档详细了解每一个组件的特性。 下面通过实例来了解ExtJS组件的应用。 一、 ExtJS简介 二、 ExtJS环境搭建 三、ExtJS开发实践 一、ExtJS----实践 ExtJS的Grid组件支持表格数据的排序、拖动、汇总、隐藏列等各种实用功能，创建一个ExtJS的Grid组件需要以下几个部分组成: 1、Store