EditorGridPanel连接后台数据库做更新操作.对于EditGridPanel编辑修改数据后更新到数据库的实现,通常有两种策略: 1.一种是监听EditorGridPanel的afteredit,每一次编辑表格后,都会触发该事件,在事件处理函数中运用Ajax将修改的数据更新到数据库; 2.建立单独的保存处理函数,提供一个保存按钮,所有编辑完成后,由用户点击触发,一次性将所有编辑改动的数据更新到数据库;
第一步:给EditorGridPanel添加afteredit事件处理代码
//给EditorGridPanel添加afteredit事件处理代码
gridPanel.on("afteredit",function(obj){
});
第二步:分析obj参数
可以看出,afteredit事件处理函数只有一个参数,是一个对象(Object e),通过这个对象,我们可以得到: 1.grid,即刚才编辑的表格对象 2.record,刚才编辑的记录 3.field,刚才编辑的是哪个字段 4.value,单元格中改动后的值 5.originalValue,单元格中改动前的值 6.row,刚才编辑的单元格在grid中的行索引位置 7.column,刚才编辑的单元格在grid中的列索引位置
//给EditorGridPanel添加afteredit事件处理代码
gridPanel.on("afteredit",function(obj){
alert(obj.record.get("id"));
alert(obj.field);
alert(obj.value);
alert(obj.originalValue);
alert(obj.row);
alert(obj.column);
});
第三步:发送异步请求。
//给EditorGridPanel添加afteredit事件处理代码
gridPanel.on("afteredit",function(obj){
var id = obj.record.get("id");
var field = obj.field;
var value = obj.value;
//发送异步请求
Ext.Ajax.request({
url:"updateUser.action",
method:"post",
params:{
id:id,
field:field,
value:value
},
success:function(result){
var jsonStr = Ext.util.JSON.decode(result.responseText)
Ext.MessageBox.alert("成功",jsonStr.msg);
},
failure:function(result){
var jsonStr = Ext.util.JSON.decode(result.responseText)
Ext.MessageBox.alert("失败",jsonStr.msg);
}
})
});
第四步:Action操作
第五步:完成更新功能
1.修改成功后记录进行提交
success:function(result){
var jsonStr = Ext.util.JSON.decode(result.responseText)
Ext.MessageBox.alert("成功",jsonStr.msg);
obj.record.commit();
},
2.修改失败后回滚
failure:function(result){
var jsonStr = Ext.util.JSON.decode(result.responseText)
Ext.MessageBox.alert("失败",jsonStr.msg);
obj.record.reject();
}
分享到:
相关推荐
NULL 博文链接:https://zxf-noimp.iteye.com/blog/629629
ExtJs表格点击超链接获取行的值,和各种获取节点值的方法
Extjs表格合并代码, 由于ie6以外的浏览器的盒模型比较怪异(主因还是我自身不擅处理CSS),列头与数据列的边框有些对不齐(当前的效果已经是尽了最大努力了)
extjs表格、树控件
extjsDemo2 form panel 一个extjs的demo。1、描绘了表格的属性;2、一个简单的页面布局。供参考。
资源名称:获取ExtjS表格的值_ ExtJS_3.4 cellSelectModel资源截图: 资源太大,传百度网盘了,链接在附件中,有需要的同学自取。
使用FlexiGrid实现Extjs表格的效果使用FlexiGrid实现Extjs表格的效果
Extjs 表格增删改例子 附加js表格例子
NULL 博文链接:https://yghjoe.iteye.com/blog/1541280
extjs 简单表格呈现extjs 简单表格呈现extjs 简单表格呈现
extjs 可编辑的表格树,每个单元格自定义编辑组件,可以自适应列宽,只有源码与例子,运行实例要修改路径,不然图片不能显示,注意etree.jsp的js引入路径 支持Ext2.x以上版本 如运行不了EmailTo : codeme9@gmail....
EXTJS页面编辑器,对于使用EXTJS作为项目界面技术支持的人,可以用该编辑器,可以快速的编辑生成你所需要的界面。
EditorGridPanel中嵌入ComboBox通常不会正常显示ComboBox的store中本想显示字段,而是显示的EditorGridPanel中 store的dataindex指定的字段内容。
Extjs代码编辑工具,编辑代码会有提示,内有安装说明
EXTjs4.0以下合并表格的例子,想要的来学习一下
extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台
实现了从后台读取数据,并进行分页显示,从后台读取treepanel数据,显示,并实现了点击节点复选框的时候,出现父节点和子节点的联动,运行环境是vs2008
使用FlexiGrid实现Extjs表格的效果.doc
EXTJS实例 EXTJS树,可以编辑的EXTJS,EXTJS3.0
Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色Extjs改变表格的颜色