ExtJS Web应用程序开发指南(第2版)(针对Ext JS 4.0更新)

《ExtJS Web应用程序开发指南(第2版)》前言

ExtJS 的前身是YUI（Yahoo User Interface）。经过不断发展与改进，ExtJS现在已经成功发布了4.0版本，并且成为构建RIA Web应用的一套最完整、最成熟的JavaScript基础库。利用ExtJS构建的RIA Web应用具有与桌面程序一样的标准用户界面和操作方式，并且能够跨不同的浏览器平台使用。ExtJS已经成为开发具有完美用户体验的Web应用选择。许 多程序员在RIA Web开发的征途中选择ExtJS作为克敌制胜的武器，因为他们可以享受ExtJS带来的类似于Win32编程的原生态快乐。

现 在用户对体验的要求越来越高。对于Web应用开发者而言，ExtJS无疑是优秀的解决方案，它能够帮助开发者快速实现良好用户界面的开发。而且由于 ExtJS是在YUI的基础上拓展出来的，在国内具有广泛的用户，再加上ExtJS又是开源的，所以ExtJS的生命力极强。

ExtJS的功能时刻吸引我们去深入探究，但由于ExtJS自身的特点，使得我们在学习它的时候会遭遇如下的诸多困惑：

• ExtJS为用户提供了功能强大的组件，但这些组件并不能满足项目中功能多变的需求，如何学会扩展已有组件呢？除了扩展组件，ExtJS组件还提供了插件功能，学会插件的编写也是一个不错的选择。那么，如何编写插件呢？
• 要扩展ExtJS组件只阅读Api文档是不行的，还必须熟悉相关的组件源代码，这样才能有效地实现组件扩展，所以应该快速掌握ExtJS的源代码。可如何快速掌握呢？
• ExtJS源代码的数量和结构比较复杂，在其中大量使用了JSON对象实现功能的封装，所以熟悉JSON对象是必须的。怎样熟悉JSON对象呢？
• 如果直接使用ExtJS的原始组件要配置的内容比较复杂，学会组件式的开发方法可以大幅减少代码量，减轻维护的强度。什么是组件式的开发方法呢？
• 在ExtJS的源代码中经常出现一些不常见的语法形式，不太容易理解。怎么理解这些源代码呢？

在《ExtJS Web应用程序开发指南(第2版)》 中 你会找到上述所有问题的答案。本书通过各种实例，全面地介绍如何使用ExtJS来进行RIA Web开发，并对ExtJS在开发过程中与其他相关技术的结合进行了说明，最终开发出功能强大、界面标准、用户体验完美的Web应用。本书的案例来自于 ExtJS开发的实际应用，大部分是来自实际的Web 应用项目，对开发者具有极强的指导意义。

本书特色

• 阅读门槛低——不要求读者对ExtJS有所了解，只要熟悉JavaScript编程，本书就能带你从头开始领略ExtJS的风采。
• 平台开发的概念——可以认为ExtJS是一种软件开发平台，而非一个普通JavaScript框架，ExtJS是用桌面程序开发思想引导基于ExtJS的Web应用。
• 来自于实践——本书中大量的案例都是实际项目情景的缩影，在讲解时穿插大量的实践经验提示，实践的指导意义强大。
• 典型场景应用——本书在讲述各章内容时穿插了一个对常见Web应用框架使用ExtJS进行改造的实例。Web应用框架是最基本的典型场景应用，每个Web开发者都会遇到。
• 包含了大量ExtJS 4.0新特性——本书是对第1版的完全升级，对ExtJS 4.0中包含的新特性进行了有重点的详细介绍，是学习ExtJS 4.0新特性的指导手册。

致谢与分工

《ExtJS Web应用程序开发指南(第2版)》 由 卫军、夏慧军和孟腊春编著。此外还要感谢王斌、张强林、万雷、张赛桥、刘军华、黄北军、陈洪军、黄中林、陈鲲、赵腾伦等人，他们为本书的出版做出了贡献。 本书由成都道然科技有限责任公司策划和审定。最后感谢Testdll、清源、Alex XRDU等多位技术专家提出的宝贵意见和建议。

限于水平和精力有限，书中疏漏之处难免，欢迎读者批评指正。为方便读者更好地理解和阅读本书，我们将《ExtJS Web应用程序开发指南(第2版)》 一书中的代码与示例提供给读者，相关代码的下载地址为：www.hzbook.com或www.dozan.cn。

目录：

第1章   认识ExtJS    1
1.1   ExtJS的精彩表现    1
1.2   ExtJS的前世今生    2
1.3   是否真的需要学习ExtJS    4
1.4   ExtJS 4.0新特性    8
1.5   ExtJS UI组件基础    10
1.6   了解一下类似技术    13
1.7   本章小结    16
第2章   开始ExtJS之旅    17
2.1   认识ExtJS的开发包    17
2.2   也从Hello world开始    18
2.3   ExtJS中的基本概念    19
2.4   非常有用的开发工具    20
2.4.1   开发插件spket    20
2.4.2   FullSource    23
2.4.3   Microsoft Script Debugger    24
2.5   ExtJS对原有JavaScript对象的扩展    25
2.5.1   Ext.Array    25
2.5.2   Ext.Date    27
2.5.3   Ext.Function    29
2.5.4   Ext.Number    30
2.5.5   Ext.String    31
2.5.6   Ext.Object    32
2.6   本章小结    33
第3章   ExtJS 4.0的基本功能    34
3.1   ExtJS组件配置说明    34
3.1.1   JSON介绍    34
3.1.2   ExtJS组件配置方式介绍    35
3.2   信息提示框组件介绍    36
3.2.1   认识Ext.window.MessageBox    37
3.2.2   Ext.MessageBox.alert()    39
3.2.3   Ext.MessageBox.confirm()    40
3.2.4   Ext.MessageBox.prompt()    41
3.2.5   Ext.MessageBox.wait()    42
3.2.6   Ext.MessageBox.show()    42
3.2.7   Ext.window.MessageBox的其他功能    45
3.3   进度条组件介绍    48
3.3.1   认识Ext.ProgressBar    48
3.3.2   手工模式的进度条    50
3.3.3   自动模式的进度条    51
3.3.4   自定义样式的进度条样式    52
3.4   实现工具栏和菜单栏    53
3.4.1   认识Ext.toolbar.Toolbar    53
3.4.2   只包含按钮的简单工具栏    54
3.4.3   包含多种元素的复杂工具栏    56
3.4.4   启用和禁用工具栏    57
3.4.5   认识Ext.menu.Menu菜单    58
3.4.6   最简单的菜单栏    58
3.4.7   创建二级或多级菜单    60
3.4.8   将更多组件加入菜单    61
3.4.9   具有选择框的菜单    62
3.5   本章小结    64
第4章   最常用的表单    65
4.1   表单及表单元素    65
4.1.1   了解Ext.form.Basic基本表单    65
4.1.2   认识 Ext.form.Panel表单面板    68
4.1.3   Ext.form.field.Base基础表单字段    70
4.1.4   Ext.form.field.Text文本域    74
4.1.5   Ext.form.field.TextArea文本区    76
4.1.6   Ext.form.field.Number数字输入框    78
4.1.7   Ext.form.field.Checkbox复选框和Ext.form.field.Radio单选框    80
4.1.8   Ext.form.CheckboxGroup和Ext.form. RadioGroup    81
4.1.9   Ext.form.field.Trigger触发字段    83
4.1.10   Ext.form.field.Spinner微调字段    84
4.1.11   Ext.form.field.Picker拾取器字段    85
4.1.12   Ext.form.field.ComboBox组合框    86
4.1.13   Ext.form.field.Time时间选择框    92
4.1.14   Ext.form.field.Date日期选择框    94
4.1.15   Ext.form.field.Hidden隐藏字段    97
4.1.16   Ext.form.field.HtmlEditor编辑器字段    98
4.1.17   Ext.form.field.Display只读文本字段    101
4.1.18   Ext.form.Label标签字段    102
4.1.19   Ext.form.FieldSet字段集    103
4.1.20   Ext.form.FieldContainer容器字段    105
4.1.21   Ext.form.field.File文件上传字段    107
4.2   实现表单验证    109
4.2.1   常见的验证类型    109
4.2.2   表单验证（VType）    110
4.2.3   自定义VType验证    111
4.3   表单的提交和加载    114
4.3.1   Ext.form.action.Action基础    114
4.3.2   Ajax模式的表单数据加载    116
4.3.3   Ajax模式的表单数据提交    119
4.3.4   标准模式的表单数据提交    121
4.3.5   使用Direct技术    123
4.4   本章小结    126
第5章   面板及布局类    127
5.1   面板panel    127
5.1.1   认识Ext.panel.Panel    127
5.1.2   Ext.panel.Panel的主要功能    128
5.1.3   使用Ext.panel.Panel    131
5.2   标准布局类    136
5.2.1   Auto自动布局    136
5.2.2   Fit自适应布局    137
5.2.3   Accordion折叠布局    138
5.2.4   Card卡片式布局    139
5.2.5   Anchor锚点布局    141
5.2.6   Absolute绝对位置布局    144
5.2.7   CheckboxGroup复选框组布局    145
5.2.8   Column列布局    145
5.2.9   Table表格布局    148
5.2.10   Border边框布局    149
5.2.11   Box盒布局    151
5.3   使用ViewPort    152
5.4   Ext.tab.Panel页签    153
5.5   本章小结    155
第6章   常用工具类与函数    156
6.1   非常有用的Ext.core.Element    156
6.2   Ext常用函数    158
6.2.1   Ext.onReady()    158
6.2.2   Ext.get()    160
6.2.3   Ext.select ()    160
6.2.4   Ext.query ()    161
6.2.5   Ext.getCmp()    163
6.2.6   Ext.getDom()    163
6.2.7   Ext.isEmpty()    164
6.2.8   Ext.namespace()    165
6.2.9   Ext.each()    165
6.2.10   Ext.apply()    166
6.2.11   Ext.encode()    167
6.2.12   Ext.htmlDecode()    168
6.2.13   Ext.typeOf()    169
6.3   Ext.core.DomHelper    169
6.3.1   Ext.core.DomHepler.append()    170
6.3.2   Ext.core.DomHelper.applyStyles()    170
6.3.3   createTemplate()    171
6.3.4   insertAfter()    172
6.3.5   insertBefore()    172
6.3.6   insertFirst()    173
6.3.7   insertHtml()    174
6.3.8   overwrite()    175
6.4   Ext.core.DomQuery    176
6.4.1   compile()    176
6.4.2   filter()    176
6.4.3   is()    177
6.4.4   jsSelect()    177
6.4.5   selectNode()    177
6.5   Ext.util.CSS    178
6.5.1   createStyleSheet()    178
6.5.2   getRule ()    179
6.5.3   swapStyleSheet()    179
6.5.4   removeStyleSheet()    181
6.6   Ext.util.ClickRepeater    182
6.6.1   click()    182
6.6.2   mousedown()    183
6.6.3   mouseup()    183
6.7   Ext.util.DelayedTask提供setTimeout的简单替代    184
6.7.1   cancle()    184
6.7.2   delay()    185
6.8   Ext.util.Format 提供常用的格式化方法    185
6.8.1   ellipsis()    185
6.8.2   capitalize()    185
6.8.3   date()    186
6.8.4   htmlEncode ()    186
6.8.5   htmlDecode()    186
6.8.6   stripTags()    187
6.8.7   substr()    187
6.8.8   lowercase()    187
6.8.9   number()    187
6.8.10   round()    188
6.9   Ext.util.JSON 编码和解码Json对象    189
6.9.1   decode()    189
6.9.2   encode()    189
6.10   Ext.util.MixedCollection    190
6.10.1   向集合加入对象    190
6.10.2   将数组中的对象加入到集合中    191
6.10.3   移除集合中的对象    191
6.10.4   克隆集合    192
6.10.5   匹配集合中关联对象    192
6.10.6   迭代集合中的对象调用指定的方法    192
6.10.7   获取集合中的对象    193
6.10.8   该类中的其他一些有用的方法    194
6.10.9   该类中重要的事件（Events）    196
6.11   Ext.util.TaskRunner    197
6.11.1   构造函数    197
6.11.2   启动一个线程start()    198
6.11.3   停止一个线程stop()    198
6.11.4   停止所有的线程stopAll()    198
6.12   Ext.util.TextMetrics得到块状化文本规格    199
6.12.1   块的绑定    199
6.12.2   实例化对象    199
6.12.3   获取文本的高度    199
6.12.4   获取文本的宽、高    200
6.12.5   获取文本的宽度    200
6.12.6   获取指定节点内文本块的宽、高    200
6.12.7   指定文本块的宽    201
6.13   Ext.KeyNav为元素提供简单的按键处理方法    201
6.13.1   实例化一个键盘绑定对象    202
6.13.2   废弃原有键盘绑定    202
6.13.3   将废弃的键盘绑定重新生效    203
6.14   Ext.KeyMap 提供更灵活强大的对按键的处理方法    203
6.14.1   构造函数    203
6.14.2   给对象添加键盘绑定    204
6.14.3   废弃已绑定到KeyMap的配置    205
6.14.4   将KeyMap或废弃的配置重新生效    205
6.14.5   获取当前KeyMap配置是否为有效    205
6.14.6   事件绑定函数    205
6.15   本章小结    205
第7章   让ExtJS开始响应事件    207
7.1   ExtJS事件与浏览器标准事件的异同    207
7.1.1   事件绑定方式    207
7.1.2   自定义事件    209
7.1.3   跨浏览器事件    210
7.2   ExtJS事件特性    211
7.2.1   Ext.util.Observable（事件基类）    211
7.2.2   举例一：addEvents 、fireEvent、addListener    213
7.2.3   举例二：capture拦截器示例    214
7.2.4   举例三：addManagedListener受管事件监听器    215
7.2.5   举例四：relayEvents传播分发事件    216
7.3   Ext.EventObject（事件对象）    217
7.4   Ext.EventManager（事件管理器）    218
7.5   本章小结    220
第8章   常见Web框架的ExtJS改造    221
8.1   常见Web应用框架说明    221
8.2   简易书籍管理系统    221
8.2.1   总体设计    222
8.2.2   数据库设计    222
8.2.3   数据库脚本    222
8.2.4   工程框架设计    223
8.2.5   页面设计    231
8.3   怎样开始    232
8.3.1   页面改造    233
8.3.2   与服务器交互方式的改造    233
8.4   开始改造吧    233
8.4.1   改造主页面布局    233
8.4.2   改造菜单栏    235
8.4.3   改造书籍维护界面    237
8.4.4   改造书籍新增界面    239
8.4.5   改造书籍修改界面    246
8.4.6   改造书籍删除功能    248
8.5   换肤的实现    250
8.5.1   创建实现换肤功能的自定义组件Ext.ux.ThemeChange    250
8.5.2   查看换肤效果    251
8.6   本章小结    251
第9章   ExtJS对Ajax的支持    252
9.1   Ext.Ajax入门    252
9.1.1   Ext.Ajax.request方法详解    253
9.1.2   Ext.Ajax.request操作示例    255
9.2   Ext.ElementLoader基础    259
9.2.1   Ext.ElementLoader.load操作示例    260
9.2.2   Ext.ElementLoader其他方法示例    262
9.3   利用Ajax优化Web应用框架    264
9.3.1   多级联动菜单    264
9.3.2   天气情况查询    267
9.3.3   自动保存的网络记事本    270
9.3.4   网页计算器    272
9.4   本章小结    274
第10章   增强型模板    276
10.1   熟悉Ext.Template    276
10.1.1   Ext.Template使用举例    277
10.2   Ext.XTemplate基础    280
10.2.1   自动填充数组和作用域切换    280
10.2.2   在子模板中访问父对象    281
10.2.3   数组索引和简单运算支持    282
10.2.4   自动渲染简单数组    283
10.2.5   使用基本的条件逻辑判断    283
10.2.6   在模板中执行任意代码    284
10.2.7   使用模板成员函数    285
10.3   在ExtJS组件中使用模板    286
10.4   使用模板的优势    288
10.5   Ext.view.View数据视图类详解    288
10.6   本章小结    291
第11章   数据模型    292
11.1   ExtJS数据模型基础    292
11.2   Model数据实体模型    293
11.2.1   创建实体    295
11.2.2   Ext.data.validations数据验证    296
11.2.3   数据代理（读取与保存）    299
11.2.4   Ext.data.HasManyAssociation一对多关系    300
11.2.5   Ext.data.BelongsToAssociation多对一关系    303
11.3   Proxy数据代理    306
11.3.1   Ext.data.proxy.Proxy    307
11.3.2   Ext.data.proxy.Client    307
11.3.3   Ext.data.proxy.Memory    307
11.3.4   Ext.data.proxy.WebStorage    308
11.3.5   Ext.data.proxy.LocalStorage    309
11.3.6   Ext.data.proxy.SessionStorage    310
11.3.7   Ext.data.proxy.Server    310
11.3.8   Ext.data.proxy.Ajax    311
11.3.9   Ext.data.proxy.Rest    315
11.3.10   Ext.data.proxy.JsonP    316
11.3.11   Ext.data.proxy.Direct    318
11.4   Reader数据读取器    319
11.4.1   Ext.data.reader.Reader    320
11.4.2   Ext.data.reader.Json    320
11.4.3   Ext.data.reader.Xml    323
11.4.4   Ext.data.reader.Array    324
11.5   Writer数据写入器    325
11.5.1   Ext.data.writer.Writer    325
11.5.2   Ext.data.writer.Json    326
11.5.3   Ext.data.writer.Xml    327
11.6   Store数据集    327
11.6.1   Ext.data.AbstractStore    327
11.6.2   Ext.data.Store    328
11.6.3   Ext.data.ArrayStore、Ext.data.JsonStore及Ext.data.XmlStore    333
11.6.4   Ext.data.DirectStore和Ext.data.JsonPStore    334
11.7   本章小结    335
第12章   Grid组件    336
12.1   表格面板Ext.grid.Panel    337
12.2   表格列Column    339
12.2.1   布尔列Ext.grid.column.Boolean    340
12.2.2   数字列Ext.grid.column.Number    340
12.2.3   日期列Ext.grid.column.Date    340
12.2.4   动作列Ext.grid.column.Action    341
12.2.5   模板列Ext.grid.column.Template    343
12.2.6   行号列Ext.grid.RowNumberer    343
12.2.7   自定义渲染函数    344
12.3   选择模式Selection    345
12.3.1   选择模式 Ext.selection.Model    345
12.3.2   单元格选择模式Ext.selection.CellModel    346
12.3.3   行选择模式Ext.selection.RowModel    348
12.3.4   复选框选择模式Ext.selection.CheckboxModel    348
12.4   表格特性Feature    349
12.4.1   表格行体Ext.grid.feature.RowBody    349
12.4.2   表格汇总Ext.grid.feature.Summary    351
12.4.3   表格分组Ext.grid.feature.Grouping    352
12.4.4   分组汇总Ext.grid.feature.GroupingSummary    353
12.5   表格插件plugin    354
12.5.1   单元格编辑插件Ext.grid.plugin.CellEditing    354
12.5.2   行编辑插件Ext.grid.plugin.RowEditing    356
12.5.3   拖曳插件Ext.grid.plugin.DragDrop    357
12.6   属性表格property.Grid    359
12.7   表格分页    361
12.8   本章小结    362
第13章   Tree组件    363
13.1   树形面板Ext.tree.Panel    363
13.1.1   多列树    364
13.1.2   带复选框的树    366
13.1.3   树面板间的拖曳    366
13.2   Ext.data.TreeStore    368
13.2.1   分级加载树节点    368
13.2.2   整体加载树节点    370
13.3   本章小结    371
第14章   ExtJS与服务端框架的整合    372
14.1   XML与JSON的生成    372
14.1.1   XStream基础    372
14.1.2   JSON-lib简介    376
14.2   ExtJS与Struts的整合方式    378
14.3   ExtJS与Struts 2的整合方式    380
14.3.1   Struts 2生成JSON数据    381
14.3.2   Struts 2生成XML数据    383
14.4   本章小结    384
第15章   主题    385
15.1   Sass和Compass概述    385
15.1.1   Sass简介    385
15.1.2   Compass简介    385
15.2   ExtJS主题样式开发    387
15.2.1   基本配置文件config.rb    387
15.2.2   定制主题    388
15.3   组件UI开发    389
15.3.1   组件UI混入函数介绍    390
15.3.2   开发面板组件UI    391
15.4   本章小结    393
第16章   Ext.Direct    394
16.1   如何配置和使用Ext.Direct    394
16.1.1   支持类库的下载    394
16.1.2   配置服务器端功能    495
16.1.3   配置客户端    400
16.1.4   远程调用实例    402
16.1.5   本章小结    408
第17章   Draw图形    409
17.1   常见浏览器绘图技术介绍及对比    409
17.2   精彩的图形世界    410
17.3   ExtJS图形包    410
17.3.1   Ext.draw.Component图形组件详解    411
17.3.2   Ext.draw.Sprite子画面组件详解    411
17.3.3   绘制基本图形    412
17.3.4   绘制不规则图形    413
17.3.5   绘制文字    414
17.3.6   线性渐变    415
17.3.7   图形旋转    417
17.3.8   动态变换    418
17.3.9   拖曳缩放    419
17.3.10   拖曳移动    420
17.4   本章小结    421
第18章   Chart图表    422
18.1   Ext.chart图表组件概述    422
18.2   坐标轴组件详解    423
18.2.1   Ext.chart.axis.Numeric数值轴    425
18.2.2   Ext.chart.axis.Category分类轴    426
18.2.3   Ext.chart.axis.Time时间轴    426
18.2.4   Ext.chart.axis.Gauge仪表轴    427
18.2.5   Ext.chart.axis.Radial雷达轴    427
18.3   图表序列详解    427
18.3.1   Ext.chart.series.Pie饼状图    428
18.3.2   Ext.chart.series.Cartesian直角坐标系图表    431
18.3.3   Ext.chart.series.Bar条形图    432
18.3.4   Ext.chart.series.Column柱状图    433
18.3.5   Ext.chart.series.Line折线图    435
18.3.6   Ext.chart.series.Scatter散点图    437
18.3.7   Ext.chart.series.Area面积图    438
18.3.8   Ext.chart.series.Radar雷达图    440
18.3.9   Ext.chart.series.Gauge仪表图    442
18.4   在图表中使用主题    443
18.5   复合图表    446
18.6   图表与表格    446
18.7   本章小结    449
附录A       450

评论

2 楼 hzbook 2011-07-26  

fxllong123456 写道

加入了Ext4.0的新特性？ 在哪里能买到啊

《ExtJS Web应用程序开发指南(第2版)》在互动网已经可以预订了，http://product.china-pub.com/198429
其他的网店，等图书印刷完毕，发货以后才能上架
感谢关注！

1 楼 fxllong123456 2011-07-25  

加入了Ext4.0的新特性？ 在哪里能买到啊