`
badmanisme
  • 浏览: 31931 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

extjs 关于editorgrid表中修改内容的保存问题

ext 
阅读更多
1.首先建立一个可编辑的grid
var cum = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), {
				header : "编号",
				dataIndex : "pno"
			}, {
				header : "参数名称",
				dataIndex : "pname"        
			}, {
				header : "参数值",
				dataIndex : "defaultValue",
				editor : new Ext.grid.GridEditor(
					new Ext.form.TextField({
						allowBlank : false
					})
				)
			}, {
				header : "备注",
				dataIndex : "remark"
			}]);

	cum.defaultSortable = true;

	var parambaseRecord = Ext.data.Record.create([{
				name : 'pno',
				type : 'integer'
			}, {
				name : 'pname',
				type : 'string'
			}, {
				name : 'defaultValue',
				type : 'string'
			}, {
				name : 'remark',
				type : 'string'
			}]);

	// 设置从后台获取数据
	var gridStore = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : context + '/paramprim/paramBaseList.action'
						}),
				reader : new Ext.data.JsonReader({
							totalProperty : 'totalCount',
							root : 'list',
							successProperty : '@success'
						}, parambaseRecord),
				remoteSort : true
			});
	// 设置默认的排序字段
	gridStore.setDefaultSort('pno', 'asc');
	gridStore.load();

	// 创建表格,设置分页
	var addParamWin_grid = new Ext.grid.EditorGridPanel({
				region : 'center',
				id : 'grid',
				loadMask : true,// 执行时有遮盖效果
				store : gridStore,
				viewConfig : {
					// 表格会自动延展每列的长度,使内容填满整个表格
					forceFit : true,
					columnsText : '显示的列',
					scrollOffset : 30,
					sortAscText : '升序',
					sortDescText : '降序'
				},
				height : 400,
				// autoHeight:true,
				autowidth : true,
				cm : cum,
				sm : new Ext.grid.RowSelectionModel({
							singleSelect : true
						}),
				bbar : new Ext.PagingToolbar({
							pageSize : 20,
							store : gridStore,
							beforePageText : "当前第",
							afterPageText : "页,共{0}页",
							lastText : "尾页",
							nextText : "下一页",
							prevText : "上一页",
							firstText : "首页",
							refreshText : "刷新页面",
							displayInfo : true,
							displayMsg : "当前显示 {0} - {1}条, 共 {2}条",
							emptyMsg : "没有记录"
						})
		  });

2.把修改内容转换成json数据传递回action
	var modified_TVM = gridStore_TVM.modified.slice(0); // 获取所有修改过的记录
								var editorRecords = [];//保存进数组
				Ext.each(modified_TVM, function(item) {
					// alert(item.data.ADDRESS); //读取当前被修改的记录地址
					editorRecords.push(item.data);// item.data中保存的是当前Record的所有字段
						// 的值(JSON),不包含结构信息 
					});
								updateParamWin_form.form.submit({
							url : context + '/paramprim/updateParamprim.action',
							method : 'post',
							success : function(form, action) {
								if (action.result.success) {
									var win = Ext.getCmp("winUpdateParam");
									win.close();
									Ext.Msg.alert('提示', '修改成功');
									store.load({
												params : {
													start : 0,
													limit : 20,
													ppno : null,
													pname : ""
												}
											});
								}
							},
							failure : function(form, action) {
								if (action.result.success == false) {
									Ext.Msg.alert('提示', action.result.msg);
								}
							},
	//把数据转换成json传递						
                   params : "data="
									+ encodeURIComponent(Ext
											.encode(editorRecords))
									+ '&pnameValue=' + pnameValue
						});

3.后台接收
接收到后是一个json类型的字符串,用JSONArray的tolist方法转换成相应的对象
分享到:
评论
4 楼 badmanisme 2012-06-13  
clean1981 写道
我是EXT新手。。请教一个东西,updateParamWin_form是什么东西呢?Ext.getCmp("winUpdateParam");又是从哪里取的?

updateParamWin_form是一个formpanel控件,
Ext.getCmp("winUpdateParam");获取id为winUpdateParam的控件,根据控件id获取的啊
3 楼 clean1981 2012-06-12  
我是EXT新手。。请教一个东西,updateParamWin_form是什么东西呢?Ext.getCmp("winUpdateParam");又是从哪里取的?
2 楼 badmanisme 2012-03-28  
studentsky 写道
我靠,能不能把页面修改后的数据如何实现回传写出来,关键代码呢?

你看清楚我的标题,“关于表中修改内容的保存问题”,请看清楚“保存”这两个字,没涉及到数据回传,就算回传我没写出来,你想知道也不是这种口气说话,虚心请教,懂么?不然别人知道也不会告诉你
1 楼 studentsky 2012-03-19  
我靠,能不能把页面修改后的数据如何实现回传写出来,关键代码呢?

相关推荐

    extjs 实现动态表头

    动态表头是ExtJS中一个高级特性,它允许开发者根据需要在运行时动态地创建和修改表格的列结构。这在处理数据展示和操作时具有很大的灵活性,尤其在数据字段不确定或需要自定义的情况下非常实用。 标题“extjs 实现...

    extjs3 window窗口修改完退出提示是否保存

    本话题主要关注如何在EXTJS3的Window组件中实现一个功能:当用户在窗口内修改了数据后,关闭窗口时提示用户是否保存更改。未进行修改的情况下,窗口可以直接关闭,不显示任何提示。 首先,我们需要创建一个基本的...

    Extjs grid 中文排序问题修正

    在EXTJS开发中,我们经常会遇到使用Grid组件展示数据的情况,特别是当数据包含中文字符时,可能会遇到排序问题。EXTJS Grid默认的排序机制对于英文字符处理得较好,但对于中文字符,由于编码和比较规则的不同,可能...

    ExtJs3.3中文API.CHM_extjs3.3中文文档_

    在"ExtJs3.3中文API.CHM"中,开发者可以找到关于ExtJS 3.3的所有API和类的详细描述,以及相关的示例代码。 ExtJS 3.3的核心特性包括: 1. **组件化**:ExtJS基于组件模型,提供了一系列预定义的UI组件,如按钮、...

    extjs4动态添加表头

    extjs4动态添加表头字段、删除、增加记录!

    extjs中文文档大全

    1. **ExtJS实用开发指南**:此部分主要针对ExtJS的实际应用,包含如何快速上手、组件的使用、布局管理、数据绑定和Ajax交互等内容。开发者可以从中了解到如何创建基本的页面结构,使用GridPanel展示数据,以及通过...

    Extjs 关于 cookie的操作

    ### Extjs 中关于 Cookie 的操作 #### 一、引言 在 Web 开发中,Cookie 是一种常用的数据存储方式,用于保存用户的一些基本信息或者状态,从而实现网站的个性化设置或登录状态保持等功能。Extjs 作为一种强大的 ...

    extJs3升级extjs4方案

    在 ExtJS 3 里生成表的几个框架组件,ExtJS4 大多生成 div,这使得 CSS classes 将会失败。ExtJS4 已完全重新写 grid 组件,tree 也被更新,所以从版本 3 到 4 大部分的属性改变了。 在 ExtJS4 中,API 也发生了很...

    ExtJs 实例+ExtJs中文教程(学习extjs必备)

    在《ExtJs 实例》中,你将找到各种实际应用场景的代码示例,这些实例涵盖了ExtJs的各种组件和功能。通过学习这些实例,你可以更好地理解如何在实际项目中应用ExtJs,例如如何创建网格(Grid)、表单(Form)、树形...

    EXTJS2.2.1中Grid表头的下拉菜单很难看

    在EXTJS中,需要正确地定位CSS选择器来修改特定元素的样式。 3. **浏览器兼容性**:EXTJS 2.2.1的时代较早,那时的浏览器兼容性问题更为普遍。某些下拉菜单的显示问题可能只在特定浏览器版本中出现,这需要开发者...

    EXTJS修改颜色实例源码

    在提供的实例源码中,我们看到的是如何在 EXTJS 中修改颜色的示例,具体涉及到 EXTJS 的 FormPanel 和 ComboBox 组件,以及自定义事件处理。 1. **FormPanel**: - `Ext.form.FormPanel` 是 EXTJS 中用于创建表单...

    extjs 双层表头

    使用extjs生成双层表头,父表头包括子表头

    Extjs 中文API文档

    Extjs 中文API文档,有对Extjs相关API的中文说明

    extJs2.0 中文手册

    由于无法直接查看图像内容,我将基于标题、描述和标签的内容,为您提供关于ExtJs2.0中文手册的知识点概述。 ExtJs是一个强大的JavaScript框架,用于创建富互联网应用(RIA)。它提供了一套丰富的组件和工具来构建...

    extjs4中文文档

    EXTJS4是一个强大的JavaScript框架,主要用于构建富客户端Web应用程序。这个中文文档是EXTJS4的官方文档...同时,文档还可能涵盖了EXTJS4的升级、调试、性能优化等相关内容,帮助开发者解决实际开发过程中遇到的问题。

    Extjs中文文档

    Extjs中文文档,包含Extjs的基本语法和各个类的详细说明以及用法。

    ExtJS3.0中文API

    绝对的ExtJS3.0中文API,本人在网上找了好久才找到的,在此奉献给大家!!解压后有30多兆!!

    ExtJs 4 API中文

    ExtJs 4 API 中文

    中文的Extjs的api手册

    手册中涵盖了ExtJS 3.3的所有类、方法、事件、属性和配置选项,对于开发者来说是不可或缺的工具。 1. **组件系统**:ExtJS的核心在于其组件模型,包括窗口(Window)、面板(Panel)、表格(Grid)、表单(Form)等...

    extjs3.3 中文文档

    EXTJS 是一个流行的JavaScript库,专门用于构建富客户端Web应用程序。EXTJS 3.3是该框架的一个版本,它在2009年发布,带来了许多改进和新特性。中文文档对于中国开发者来说是一个非常宝贵的资源,因为它消除了语言...

Global site tag (gtag.js) - Google Analytics