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

最新推荐文章于 2020-03-29 18:55:56 发布

gwikimo

最新推荐文章于 2020-03-29 18:55:56 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签： ext function object string 存储 ui

本文链接：https://blog.youkuaiyun.com/gwikimo/article/details/4501308

JavaScript 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种使用ExtJS框架动态向表格组件添加数据的方法。通过一个“增加”按钮和复选框来控制不同表格的数据添加流程。具体实现包括根据复选框状态选择目标表格、获取表格列定义及数量、构建记录行并插入到表格数据存储中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

因为最近项目需要，一直在用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); }