首页 > PHP资讯 > HTML5培训技术 > Extjs4中grid的增删改操作

Extjs4中grid的增删改操作

HTML5培训技术
Ext.define('JCY.app.controller.UserController',{	extend:'Ext.app.Controller',	alias:'widget.userController',	init:function(){		this.control({			'gridView':{beforerender:this.beforerender}		});	},	beforerender:function(comment,obj){		var store = comment.getStore();//得到grid的store		var selModel = comment.getSelectionModel();//得到选择的model		/**		 * 添加		 */		comment.down('button[id=add]').on('click',function(){			var addUser=Ext.create('JCY.app.view.AddUserForm').show();			var form=addUser.down('form');//获取表单			var model=store.model;//获取model			form.down('button').on('click',function(){				form.submit({					url:'/Extjs4/gridAction!saveUser.action',					method:'post',					success:function(form,action)					{						var num=form.findField('num').getValue();//获取表单里面的值						var name=form.findField('name').getValue();						var email=form.findField('email').getValue();//						var data=action.response.responseText;//						var json=eval("("+data+")");						addUser.close();						var m=new model(								{num:num,name:name,email:email});						store.add(m);//默认加在后面					}				});			});						});		/**		 * 修改		 * 要先获取model, 再新建带数据的这个model		 * 		 */		comment.down('button[id=edit]').on('click',function(){			var record=selModel.getSelection();//得到选择的数据			if(record.length==1)			{				var editUser=Ext.create('JCY.app.view.AddUserForm');				editUser.setTitle('修改用户信息');				editUser.setIconCls('table_edit');				editUser.down('form').loadRecord(record[0]);//装载信息				var text=editUser.down('form').down('textfield');				text.readOnly=true;				editUser.show();				var form=editUser.down('form');				editUser.down('button').on('click',function(){					form.submit({						url:'/Extjs4/gridAction!editUser.action',						method:'post',						success:function(form,action){							var num=form.findField('num').getValue();//获取表单里面的值							var name=form.findField('name').getValue();							var email=form.findField('email').getValue();							editUser.close();							var model=store.model;//获取model							var m=new model(									{num:num,name:name,email:email});							store.add(m);//默认加在后面//							store.insert(0,m);//第一个是插入的位置						}					});				});			}			else			{				Ext.Msg.alert("提示", "请选择一条数据!").setIcon("ext-mb-info");			}		});		/**		 * 删除		 */		comment.down('button[id=del]').on('click',function(){			if(selModel.hasSelection())			{				var selected=selModel.getSelection();				var ids=[];				Ext.each(selected,function(item){					ids.push(item.data['num']);//					alert(item.get('num'));				});				Ext.Msg.confirm('提示','你确定要删除吗',function(b){					if(b='yes')					{						Ext.Ajax.request({							url:'/Extjs4/gridAction!delUser.action',							params:{ids:ids},							method:'post',							success:function(response){								Ext.Array.each(selected,function(record){									store.remove(record);//删除grid中的数据								});							}						});					}									});			}			else {			Ext.Msg.alert("提示", "你还没有选择要修改的数据!").setIcon(					"ext-mb-info").setWidth(200);			}		});	},	models:['JCY.app.model.GridModel'],	stores:['JCY.app.store.GridStore'],	views:['JCY.app.view.GridView','JCY.app.view.GridView2','JCY.app.view.AddUserForm']});

上一篇:js处理json数据
下一篇:JVM运行原理解析

HTML5培训技术

本文由欣才IT学院整理发布,未经许可,禁止转载。
支持46不支持0