Editor Grids（可编辑表格） 在之前的一章中我们学习了如何在结构化的表格中显示用户可操作的数据。但是，这种表格有一个最大的限制，那就是用户无法自己编辑表格中的数据。幸运的是，Ext 提供了EditorGridPanel 这一控件，它支持用户对表格进行编辑——我们现在就对这一控件进行学习。它的工作形式类似于 Excel，允许用户在点击单元格后进行数据的编辑操作。 在这章里，我们将会学到： 为用户提供连接到 data store 的可编辑表格； 把编辑后的数据发给服务器，允许用户通过 ExtJS 的editor grid 更新服务器端的数据； 通过编码操控grid 并对事件做出相应； 教给你一些高级的格式化小窍门并且让您建立更加强大的editor grid。 但是，首先，我们要看看可以用可编辑表格能够做什么事情。 我们能用可编辑表格做什么？ EditorGridPanel 和我们之前使用到的表单（form）很相似。实际上，editor gird使用了和 form 中完全一样的表单字段。通过使用表单字段来实现对grid 单元格进行编辑，我们可以充分利用表单字段提供的同样的功能。包括输入约束以及数值验证等。把它和 Ext 的GridPanel 联合起来，就造就了可以满足我们任何需求的漂亮的控件。 这个表格中的所有字段都可以被编辑，如同使用表格字段中的text field（文本字段）、date picker（日期选择器）、combo box（组合框/下拉菜单）一般。 使用可编辑的表格： 可编辑和不可编辑表格的区别十一个相当简单的开始的过程。复杂的使我们需要处理编辑状态然后传回服务器。但是一旦你学会了如何去做，这部分也就同样变得相当的简单。 让我们先看看如何把第五章开头部分的表格升级到可以编辑电影标题（title）、导演（director）、和标语（tagline）。修改后的代码如下所示： var title_edit = new Ext.form.TextField(); var director_edit = new Ext.form.TextField({vtype: 'name'}); var tagline_edit = new Ext.form.TextField({ maxLength: 45 }); var grid = new Ext.grid.EditorGridPanel({ renderTo: document.body, frame:true, title: 'Movie Database', height:200, width:520, clickstoEdit: 1, store: store, columns: [ {header: "Title", dataIndex: 'title',editor: title_edit}, {header: "Director", dataIndex: 'director',editor: director_edit}, {header: "Released", dat...
