Ext中一个按钮控制两个表格数据添加

 

因为最近项目需要，一直在用Ext写东西，感觉Ext的封装还是不错的，解决了开发过程中的一些UI问题。好了，废话不多说了，在此先分享一些自己的编码过程中的心得。

需求是这样的：利用一个“增加”按钮，一个复选框去控制两个表格控件的数据添加。

Demo：http://sites.google.com/site/gwikimo 中ExtGrid.rar

核心代码如下：

 

 

//添加表格数据的方式 function addOperateData() { grid = unitGrid;//默认添加父表数据，也可在方法中带参传入 //根据复选框判断是否操作子表 if (isUnitGrid.getValue()) { grid = memberGrid; } //获取被操作表格的列定义 var cm = grid.getColumnModel(); //获取表格的列数 var columnCount = cm.getColumnCount(); //声明行定义的数组变量 var rowDefineArray = new Array(); //循环每列获取列名，数据类型，设置默认值 for (var i = 0; i < columnCount; i++) { //创建每列数据定义的对象obj var obj = { name : cm.getDataIndex(i), type : 'string', defaultValue : '' }; //将obj对象加入行定义的数据变量中 rowDefineArray.push(obj); } //定义一个记录行，参数为行定义的数组变量 var ItemDataDefine = Ext.data.Record.create(rowDefineArray); var record = new Object(); //在增加行前添加默认值'' for (var i = 0; i < rowDefineArray.length; i++) { var attr = rowDefineArray[i].name; record[attr] = '';//添加默认值，可以自己修改 } //创建记录行 var i = new ItemDataDefine(record); grid.stopEditing(); var store = grid.getStore();//获取表格数据存储 //增加数据行 store.insert(0, i); //默认编辑第一个单元格 grid.startEditing(0, 0); }