Extjs中EditorGridPanel修改并获取数据的两种方式

有时候我们会使用Extjs的EditorGridPanel组件来实现必要的功能，然而当我们修改可编辑单元格值之后，我们怎么获取修改的数据呢？

例如：当需要修改EditorGridPanel组建中部分数据，并获取修改内容提交保存。实现方法有两种，一种是动态保存，一种是修改后批量保存。简单说明如下：

动态获取更新数据：
动态保存修改内容，可用监听实现，可到底怎样才能在单元格修改后触发呢？这里做简单说明。我们可以直接在EditorGridPanel组件对象中添加afteredit监听（也有beforeedit监听，若需要，也可使用），它的参数为当前修改，可在此监听中获取相应数据并通过ajax完成修改。可通过其参数获取如下数据：
e.row;//修改过的行从0开始
e.column;//修改列索引
e.originalValue;//原始值
e.value;//当前值
e.grid;//当前修改的grid
e.field;//正在被编辑的字段名
e.record;//正在被编辑的行数据
用例代码如下：

//...
new Ext.grid.EditorGridPanel({
	clicksToEdit:1,
	forceValidation:true,
	frame : true,
	stripeRows:true,
	border:false,
	ds:ds,//配置数据源Store
	cm:cm,//配置列模型ColumnModel
	bbar:new Ext.PagingToolbar({
		pageSize:page,//页面大小参数page
		store:ds,
		displayInfo: true,
		afterPageText: '/ {0}',
		beforePageText: '页',
		firstText : "第一页",
		prevText : "上一页",
		nextText : "下一页",
		lastText : "最后页",
		refreshText : "刷新",
		displayMsg: '显示第 <em>{0}</em> 条到 <em>{1}</em> 条记录，一共 <em>{2}</em> 条',
		emptyMsg: "没有记录"
	}),
	loadMask:{msg:'数据加载中...'},
	listeners:{
		afteredit:function(e){
			//修改方法
			update(e.record.get("id"),e.field,e.value);
		}
	 }
})
//...

批量获取更新数据：
批量获取修改数据，可通过Ext.data.Store对象的getModifiedRecords()方法得到当前已修改的所有行数据的数组，可循环获取其中所需数据，重新组装成我们想要的数据，再作为ajaxc参数进行提交，实现操作。

//...
var arr = [];//声明空数组
var records = ds.getModifiedRecords();
Ext.each(records,function(record){//遍历行数据数组
	arr.push(record.data);
});
//...