`

extjs 增删改查

 
阅读更多
App.tabs.eduHighRiskGravida = (function(){
	var limit = 20,tabId = "eduHighRiskGravidaTab",addOrUpdateWin = null, acrWin = null, aclWin = null;
	function init(){
		 
		var curPanel = Ext.getCmp('tabsPanel');
		var store = new Ext.data.Store({
			autoLoad:false,
			proxy:new Ext.data.HttpProxy({url:App.baseURL+'/eduHighRiskGravida/findPage'}),
			reader:new Ext.data.JsonReader({
				totalProperty:'totalCount',
				root:'datas',
				idProperty:'id',
				fields:[{name:'id'},{name:'week1'},{name:'week2'},{name:'content'},{name:'statue'},{name:'highRiskName'},{name:'highRiskId'},{name:'highRiskState'}]
			}),
			baseParams:{start:0,limit:limit,field:'',keyword:''},
			listeners:{
				loadexception:function(proxy,type,action,options,response){
					App.failureCallback(action);
				}
			}	
		}),
		sm = new Ext.grid.CheckboxSelectionModel({singleSelect:false}),
		cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),sm,
			{header : '因          素',dataIndex : 'highRiskName',sortable : true,width : 200},
			{header : '时间范围',dataIndex : 'week1',sortable : true,width : 200,renderer:function(value, metaData, record, rowIndex, colIndex, store){
				return record.get('week1')+" -  "+ record.get('week2') ; 
			}},
			{header : '指导内容',dataIndex : 'content',sortable : true,width : 200} 
		]),
		grid = new Ext.grid.GridPanel({
			id:'eduHighRiskGravidaGrid',
			border : false,
			columnLines : true,
			autoScroll : true,
			store : store,
			autoHeight:false,
			stripeRows:true,
			cm : cm,
			sm : sm,
			loadMask : {msg : CONST.TIP017},
			bbar:new Ext.PagingToolbar({
				pageSize : limit,
				store : store,
				emptyMsg : "<font color='red'>没有记录</font>",
				displayInfo : true,
				plugins:new Ext.ux.ComboPageSize({addToItem:true,index:10})
			}),
			tbar:[{text:'添加',iconCls:'add',handler:function(){showAddOrUpdate('add');}},
				' ',{text:'修改',iconCls:'update', handler:function(){showAddOrUpdate('update');}},
				' ',{text:'删除',iconCls:'delete',handler:doDelete},
				'->',{
					xtype:'combo',
					id:'searchCombo',
					typeAhead: true,
				    triggerAction: 'all',
				    lazyRender:true,
				    mode: 'local',
				    value:'选择查询内容',
				    width:80,
				    editable:false,
				    store: new Ext.data.ArrayStore({
				        fields: ['keytype','keytext'],
				        data: [['week1', '孕周段1'], ['week2', '孕周段2'], ['content', '指导内容']]
				    }),
				    valueField: 'keytype',
				    displayField: 'keytext'
				},' ',{xtype:'textfield',emptyText:'输入关键字查找',enableKeyEvents:true,id:'searchText',width:180,
					listeners:{
						keydown:{
							fn:function(t,e){
								if(e.keyCode == 13){
									search();
								}
							},
							buffer:350,
							scope:this
						}
					}
			},' ',
			{text:'查&nbsp;&nbsp;询',iconCls:'query',handler:search},'-',
			{text:'刷&nbsp;&nbsp;新',iconCls:'refresh',handler:function(){
				Ext.getCmp('searchCombo').setValue("week1");
				Ext.getCmp('searchText').setValue("");
				Ext.apply(store.baseParams,{field:'',keyword:''});
				store.load();
			}}]
			
		}),
		tab = curPanel.add({
			title : '&nbsp;高危孕产妇&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;',
			id : tabId,
			closable : true,
			layout : 'card',
			iconCls:'userSuit',
			activeItem :0,
			listeners:{
				activate:function(p){
					store.load();
				}
			},
			items:[grid]
		});	
		curPanel.setActiveTab(tab);
	}
	
	/** 添加或者修改 **/
	function showAddOrUpdate(type){
		
		var store = new Ext.data.Store({
			autoLoad:false,
			proxy:new Ext.data.HttpProxy({url:App.baseURL+'/eduHighRiskGravida/findPage'}),
			reader:new Ext.data.JsonReader({
				totalProperty:'totalCount',
				root:'datas',
				idProperty:'id',
				fields:[{name:'id'},{name:'week1'},{name:'week2'},{name:'content'},{name:'statue'},{name:'highRiskName'}]
			}),
			baseParams:{start:0,limit:limit,field:'',keyword:''},
			listeners:{
				loadexception:function(proxy,type,action,options,response){
					App.failureCallback(action);
				}
			}	
		});
		
		var title='',iconCls='',btnText='',url='',record=null,grid = Ext.getCmp('eduHighRiskGravidaGrid');
		if(type == 'add'){
			title='添加',iconCls='add',btnText='保存',url=App.baseURL+'/eduHighRiskGravida/add';
		}else if(type == 'update'){
			title='修改',iconCls='update',btnText='修改',url=App.baseURL+'/eduHighRiskGravida/update';
			var selectRocords = grid.getSelectionModel().getSelections();
			if(selectRocords.length <= 0){
				Ext.UxMsg.alert({msg:CONST.TIP001});
				return;
			}else if(selectRocords.length > 1){
				Ext.UxMsg.alert({msg:CONST.TIP002});
				return;
			}else{
				record = selectRocords[0];
			}
		}
		if(!addOrUpdateWin){
			addOrUpdateWin = new Ext.Window({
				title:title,
				height:400,
				width:450,
				iconCls:iconCls,
				constrain:true,
				modal:true,
				resizable:true,
				renderTo:tabId,
				closeAction:'close',
				bodyStyle:'background-color:white;',
				listeners:{
					close:function(){grid.getStore().reload();addOrUpdateWin.destroy();addOrUpdateWin = null;}
				},
				items:[new Ext.form.FormPanel({
					ref:'itemForm',
					id:'itemForm',
					url : url,
					layout:'form',
					border:false,
					labelWidth:75,
					labelAlign:'right',
					buttonAlign:'center',
					defaults:{anchor:App.anchor,xtype:'textfield',ctCls:'formMargin',labelStyle:App.labelStyle},
					items:[{
						fieldLabel:'孕周段1',
						ref:'../week1',
						allowBlank:false,
						name:'week1',
						maxLength:25
					},{
						fieldLabel:'孕周期2',
						ref:'../week2',
						name:'week2',
						allowBlank:false,
						maxLength:8
					},{
						xtype:'combo',
						fieldLabel:"高危因素一级分类",
						id:'highRiskName1',
						ref:'../highRiskName1',
						typeAhead: true,
					    triggerAction: 'all',
					    lazyRender:true,
					    mode: 'local',
					    value:'请选择',
					    width:80,
					    editable:false,
					    store: new Ext.data.ArrayStore({
					        fields: ['keytype','keytext'],
					        data: [['1', '本次妊娠基本情况'], ['2', '不良孕产史'], ['3', '妊娠合并症'], ['4', '妊娠并发症'], ['5', '环境与社会因素']]
					    }),
					    valueField: 'keytype',
					    displayField: 'keytext',
					    listeners: { 
							'select': function(combo, record, index){ 
						    	    
									//var value = Ext.get("highRiskName1").dom.value;
									//alert( combo.getValue()+'  '+record.get('keytype')  +'  '+ index +'   ' + value );
						    		var highRiskNameStore =  Ext.getCmp('highRiskName').getStore();
						    		highRiskNameStore.removeAll(false);
									Ext.apply( highRiskNameStore.baseParams,{ state:combo.getValue() });
									highRiskNameStore.load();
							}
						}
					},{
						xtype:'combo',
						id:'highRiskName',
						ref:'../highRiskName',
						editable:false,
						fieldLabel:"高危因素二级分类",
						triggerAction:"all",
						mode:"remote",
						allowBlank:false,
						enable:false,
						store:new Ext.data.Store({
							id:'highRiskNameStore',
							//autoLoad:true,
							proxy:new Ext.data.HttpProxy({url:App.baseURL+"/dicHighrisk/getHighRiskByStatue"}),
							reader:new Ext.data.JsonReader({fields:[{name:"id"},{name:"name"}]}),
							baseParams:{state:'0'},
							listeners:{
								loadexception:function(proxy,type,action,options,response){
									App.failureCallback(action);
								},
								'beforeload':function( store ,   options ){
									//alert( store.baseParams.state );
								 
								}
							}
						}),
						displayField:"name",
		 				valueField:"id",
		 				hiddenName: 'highRiskId', //传到后台的name
		 				name:'highRiskId',
						autoShow:true
					},{
						xtype:'htmleditor',
						fieldLabel:'指导内容',
						width:430,
						height:150,
						ref:'../content',
						name:'content',
						allowBlank:false 
					} ]
				})],
				bbar:['->',{
					text:btnText,
					iconCls:'saveBtn',
					handler:function(){
						var myForm = addOrUpdateWin.itemForm.getForm();
						if(!myForm.isValid()){return;}
						/*
						var week1 = addOrUpdateWin.week1.getValue(),
						week2 = addOrUpdateWin.week2.getValue(),
						content = addOrUpdateWin.content.getValue(),
						highRiskName = addOrUpdateWin.highRiskName.getValue();
						*/
						 
						//App.myMask = new Ext.LoadMask(addOrUpdateWin.el,{msg:CONST.TIP016,removeMask:true});
						//App.myMask.show();

						myForm.submit( {
							success : function(form,responseObj){
								 
								//var json = App.parseJSON( responseText );
								var json = Ext.util.JSON.decode(responseObj.response.responseText);
								//alert( responseObj.response.responseText +' ' +json.msg );
								if(json && json.success){
									Ext.UxMsg.alert({msg:CONST[json.msg]});
							 
									if(type == 'add' ){
										myForm.reset();
									}
									addOrUpdateWin.close();
									//myForm.reload();
									Ext.getCmp('eduHighRiskGravidaGrid').getStore().reload();
									
								}
							},
							failure : App.failureCallback,
							waitTitle : '等待',
							waitMsg : '保存中,请稍后...'
						});
						/*
						Ext.Ajax.request({
							url:url,
							method:'POST',
							params:{week1:week1,week2:week2,content:content,highRiskName:highRiskName,id:record?record.data.id:0},
							success:function(response){
								var json = App.parseJSON(response.responseText);
								if(json && json.success){
									Ext.UxMsg.alert({msg:CONST[json.msg]});
									if(type == 'update'){
						    			addOrUpdateWin.close();
						    		}else{
						    			myForm.reset();
						    		}
								}
							},
							failure:App.failureCallback
						});
						*/
					}
				},'-',{text:'重置',iconCls:'resetBtn',handler:function(){addOrUpdateWin.itemForm.getForm().reset();}},
				'-',{text:'取消',iconCls:'cancelBtn',handler:function(){addOrUpdateWin.close();}
				}]
			});
			
		}
		addOrUpdateWin.show();
		App.modules.changeEnterToTab();
		if(type == 'update'){
			//alert(addOrUpdateWin.itemForm.items.getCount() );
			var id = new Ext.form.Hidden({
				xtype : 'hidden',
				name : 'id',
				ref:'../id',
				value:record.data.id
					
			 });
			addOrUpdateWin.itemForm.items.add( id );
			//alert(addOrUpdateWin.itemForm.items.getCount() );
			Ext.getCmp("itemForm").getForm().loadRecord(record);
		 
			//var recordHighRisk = new Ext.data.Record.create([{name:"id"},{name:"name"}]);
			//var recordData = new recordHighRisk({ 'id' : record.get('highRiskId')  , 'name':record.get('highRiskName')  });
			//Ext.getCmp('highRiskName').getStore().add(recordData);
			//addOrUpdateWin.highRiskName.load();
			//Ext.getCmp('highRiskName').getStore().load();
			//alert( Ext.getCmp('highRiskName').getStore().getAt(0).get('id') );
			
			//alert(record.get('highRiskId') +'   '+record.get('highRiskName') );
			//addOrUpdateWin.highRiskName.hiddenValue=record.get('highRiskId');
			
			//重新加载combox ,然后选中某一项 
    		var highRiskNameStore =  Ext.getCmp('highRiskName').getStore();
    		highRiskNameStore.removeAll(false);
			Ext.apply( highRiskNameStore.baseParams,{ state:record.get('highRiskState') });
			highRiskNameStore.load();
			Ext.getCmp('highRiskName').setValue(record.get('highRiskId'));
			Ext.getCmp('highRiskName').setRawValue(record.get('highRiskName'));
			/*
				alert(record.data.id );
				addOrUpdateWin.id.setValue( record.data.id);
				addOrUpdateWin.week1.setValue(record.data.week1);
			    addOrUpdateWin.week1.setValue(record.data.week1);
				addOrUpdateWin.week2.setValue(record.data.week2);
				addOrUpdateWin.content.setValue(record.data.content);
				addOrUpdateWin.highRiskName.setValue(record.data.highRiskName);
			
			Ext.getCmp('itemForm').load( {
				url : '/eduHighRiskGravida/queryById/'+record.data.id,
				method : 'GET'
			});
			*/
		}
	}

	/** 输入框查询 **/
	function search(){
		var keytype = Ext.getCmp('searchCombo').getValue(),
		searchtext = Ext.getCmp('searchText').getValue(),
		_store = Ext.getCmp('eduHighRiskGravidaGrid').getStore();
		if(searchtext && searchtext !='输入关键字查找'){
			Ext.apply(_store.baseParams,{keyword:searchtext,field:keytype});
			_store.load();
		}else{
			Ext.apply(_store.baseParams,{field:'',keyword:''});
			_store.load();
		}
	}
	
	function doDelete(){
		var ids = '',dids = '',grid = Ext.getCmp('eduHighRiskGravidaGrid'),selects = grid.getSelectionModel().getSelections();
		if(selects.length <= 0){
			Ext.UxMsg.alert({msg:CONST.TIP003});
			return;
		}
		for (var i = 0; i < selects.length; i++) {
			ids += ',' + selects[i].json.id;
			dids += ',' + selects[i].json.did;
		}
		Ext.Msg.confirm("提示",CONST.TIP023,function(val){
			if(val=='yes'){
				 App.myMask = new Ext.LoadMask(grid.el,{msg:CONST.TIP018,removeMask:true});
				 App.myMask.show();
				 Ext.Ajax.request({
					url:App.baseURL+"/eduHighRiskGravida/delete",
					method:'POST',
					params:{ids:ids.substring(1)},
					success:function(response){
						var json = App.parseJSON(response.responseText);
						if(json && json.success){
							Ext.UxMsg.alert({msg:CONST[json.msg]});
							grid.getStore().reload();
						}
					},
					failure:App.failureCallback
				});
			}
		});
	}
 
	
	function Cleanup() {   
	    window.clearInterval(idTmr);   
	    CollectGarbage();   
	};  

	
	/** 激活面板 **/
	function active(){
		var curPanel = Ext.getCmp('tabsPanel');
		curPanel.setActiveTab(tabId);
	}
	 
	return {
		init:init,
		active:active
	};
})();

 

 

 1  grid 中加载的数据

{"totalCount":14,"pageNumber":1,"pageSize":10,"totalPage":2,"datas":[{"content":"指导内容:  =========修改后内容","id":18,"highRiskId":127,"statue":0,"week1":1,"highRiskState":2,"week2":2,"highRiskName":"不孕史"},{"content":"5411","id":17,"highRiskId":111,"statue":0,"week1":3411,"highRiskState":4,"week2":4411,"highRiskName":"重度子痫前期"},{"content":"4441","id":16,"highRiskId":95,"statue":0,"week1":21,"highRiskState":2,"week2":31,"highRiskName":"疤痕子宫(2次以上)"},{"content":"555","id":15,"highRiskId":123,"statue":0,"week1":3,"highRiskState":1,"week2":4,"highRiskName":"中度智力低下"},{"content":"555","id":14,"highRiskId":96,"statue":0,"week1":3,"highRiskState":2,"week2":4,"highRiskName":"子宫破裂史"},{"content":"<FONT color=#ff0000>7222</FONT>","id":13,"highRiskId":122,"statue":0,"week1":5,"highRiskState":1,"week2":6,"highRiskName":"辅助生育怀孕者"} ]}

 

 2  修改时加载的数据

  

[{"id":95,"name":"疤痕子宫(2次以上)"},{"id":96,"name":"子宫破裂史"},{"id":97,"name":"产后出血抢救史"},{"id":127,"name":"不孕史"},{"id":128,"name":"三次自然流产或早产≥2次"},{"id":129,"name":"死胎/死产/新生儿死亡史"},{"id":130,"name":"刮宫手术史≥2次"},{"id":131,"name":"阴道难产史"},{"id":132,"name":"疤痕子宫(剖宫产史、子宫肌瘤剜除史等)"},{"id":177,"name":"产钳/胎吸臀牵引史"},{"id":178,"name":"妇科生殖器手术史"},{"id":179,"name":"早产/先天性异常儿史"},{"id":180,"name":"流产史≥2次"}]

 

分享到:
评论

相关推荐

    ExtJS增删改查

    在"ExtJS增删改查"这个主题中,我们将深入探讨如何利用ExtJS进行CRUD(创建Create、读取Read、更新Update和删除Delete)操作,这是任何数据库驱动的应用程序中的基本功能。 首先,创建(Create)操作通常涉及创建新...

    extjs增删改查分页树

    extjs增删改查分页树

    Extjs 增删改查

    ### Extjs 增删改查操作详解 #### 一、引言 在现代Web开发中,Extjs作为一款强大的JavaScript框架,被广泛应用于构建复杂的前端应用。它提供了丰富的组件库,可以方便地实现诸如表格数据展示、增删改查等常见功能。...

    php_extjs 增删改查

    "php_extjs 增删改查"这个主题聚焦于如何使用这两种技术来实现一个基本的数据管理应用程序,涵盖了前端用户界面的构建以及后端数据处理。 **PHP** 是一种广泛使用的开源脚本语言,尤其适用于Web开发。它允许开发者...

    extJs 简单的增删改查

    在“简单的增删改查”这个主题中,我们将探讨如何使用ExtJS实现数据管理的基本操作,包括添加(Add)、删除(Delete)、修改(Update)和查询(Query)。 首先,我们需要了解ExtJS的核心概念,如组件(Components)...

    Extjs增删改查示例

    在这个"Extjs增删改查示例"中,我们将探讨如何使用ExtJS与etmvc(一个基于ExtJS的MVC模式扩展)和MySQL数据库配合,实现Web应用中的基本数据操作。 首先,ExtJS的MVC模式是其架构的核心部分,它将应用程序分为Model...

    EXTJS 增删改查及c#json连接数据库

    在"EXTJS 增删改查及c#json连接数据库"这个主题中,我们将深入探讨EXTJS如何与后端C#.NET结合,通过JSON数据交换实现对数据库的CRUD(创建、读取、更新、删除)操作。 首先,EXTJS的GridPanel是进行数据展示的核心...

    ExtJs增删改查实例,献给初学者(佳家记账)

    这个"ExtJs增删改查实例,献给初学者(佳家记账)"的项目是专门为初学者设计的,旨在帮助他们理解如何使用ExtJS进行基本的数据操作,如添加、删除、修改和查询。在Web开发中,这些功能通常被称为CRUD(Create, Read, ...

    EXTJS4+STRUTS2+JAVA增删改查

    在这个"EXTJS4+STRUTS2+JAVA增删改查"的例子中,我们将深入探讨这三个技术如何协同工作,实现数据的动态管理。 EXTJS4是一个强大的JavaScript库,主要用于创建桌面级的Web应用程序。它提供了丰富的组件库,如表格、...

    ExtJs的增删改查功能

    ExtJs 提供了多种组件用于实现增删改查的交互,如`Ext.form.Panel`用于创建表单,`Ext.grid.Panel`用于显示和编辑表格数据,以及`Ext.toolbar.Toolbar`用于添加操作按钮如“新增”、“编辑”、“删除”。...

    Extjs增删改查项目

    对爱好extjs初学者来说有非常大的帮助

    Extjs实现了增删改查(增加了动态树)上次升级版

    这个"Extjs实现了增删改查(增加了动态树)上次升级版"项目,显然是利用ExtJS的功能来实现了一个完整的数据操作功能,包括添加、删除、修改和查询,同时还集成了一项新的特性——动态树视图。 动态树视图是ExtJS中...

    extjs做的增删改查

    在"extjs做的增删改查"项目中,ExtJS负责前端展示和用户交互,而Struts2则负责后端业务逻辑处理和与数据库的交互。以下是关于这个主题的一些详细知识点: 1. **ExtJS组件**: - 表格(Grid):用于显示和编辑数据...

    Ext Demo grid的增删改查例子

    接下来 在mysql里建立 数据库位ext的库 再去项目中 src/META-INF/persistence.xml的配置文件里吧&lt;!-- &lt;property name="hibernate.hbm2ddl.auto" value="update" /&gt; --&gt;这句话的注释去掉 好了 部署项目到tomcat上 ...

    EXTJS net 增删改查示例

    在"EXTJS net 增删改查示例"中,我们将探讨如何使用EXTJS与后端网络接口(通常基于.NET框架)进行数据交互,实现常见的CRUD(Create、Read、Update、Delete)操作。这些基本操作是任何数据库驱动的应用程序的核心...

    Extjs 实现增删改查

    Extjs 实现增删改查,可以与后台代码结合起来,利于实现

    extjs增删改查典型案例

    function showUserForm() { //将变量定义成局部变量,避免每次都生成一个新对象 var userForm = null; userForm = new Ext.FormPanel({ id:'conditionForm', labelWidth:'80', labelAlign:'right', ...

    extjs常用增删改查操作

    ### ExtJS 增删改查操作详解 #### 一、引言 ExtJS 是一款强大的 JavaScript 框架,用于构建复杂的前端应用程序。通过利用其丰富的组件库和灵活的数据处理能力,开发者能够轻松实现数据的增删改查(CRUD)操作。本文...

Global site tag (gtag.js) - Google Analytics