`

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

    博客分类:
  • Ajax
阅读更多

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

需求是这样的:利用一个“增加”按钮,一个复选框去控制两个表格控件的数据添加。核心代码如下:

//添加表格数据的方式
	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);
	}  

 有兴趣的可以下载下附件,里面有具体的代码实现,已经把Ext需要的相关文件也放到了一起,直接点击就能测试。接下来有时间的话分享下Ext中树的一些心得。

1
0
分享到:
评论
1 楼 MyChina 2009-08-21  
不错怎么删除没反应?

相关推荐

    ext2.0 grid 分页实例(php)

    Grid组件是Ext JS中一个强大的数据展示工具,能够以表格形式展示大量数据,而分页则是处理大数据集时不可或缺的功能,它可以提高用户体验并优化系统性能。 首先,让我们理解什么是Ext JS Grid。Grid是一种用户界面...

    轻松搞定ext

    通过学习这两个组件的使用,初学者可以掌握如何创建具有交互性的用户界面元素。 #### 第十章:数据与ComboBox 数据处理是Web应用的核心,ExtJS提供了DataProxy、DataReader、Store等类用于数据的加载和管理。结合...

    Extjs学习实例

    1. Ext.MessageBox.alert():此方法用于显示一个带有警告信息的简单消息框,它接受至少两个参数,第一个是标题(title),第二个是要显示的信息(msg),第三个参数是一个可选的回调函数(function),当用户关闭消息框时...

    Extjs中文文档.pdf

    - **Ext.apply() 和 Ext.applyIf()**:这两个方法用于合并对象,掌握它们的使用方法对于构建复杂的组件非常有用。 #### 三、消息框 - **基本消息框**:包括提示框、输入框和确认框等,这些都是与用户交互的基本方式...

    ExtJs 学习笔记 Hello World!第1/2页

    它接受两个参数,分别代表标题和消息内容。此外,还有`Ext.Msg.alert`的简写形式。例如: ```javascript Ext.MessageBox.alert('标题', '弹出内容'); // 或者 Ext.Msg.alert('', '弹出内容'); ``` 这将显示一个带...

Global site tag (gtag.js) - Google Analytics