ext 左右表格數據互相移動

var chooseSm = new Ext.grid.CheckboxSelectionModel({singleSelect: false});  
	var allSm = new Ext.grid.CheckboxSelectionModel({singleSelect: false});
	
	// 移除崗位
	var removeJobFunction = function(){
		var selRows = allGrid.getSelectionModel().getSelections();
		unstationStore.add(selRows);
		hasstationStore.remove(selRows);
	}
	
	// 添加崗位
	var addJobFunction = function(){
		var selRows = chooseGrid.getSelectionModel().getSelections();
		hasstationStore.add(selRows);
		unstationStore.remove(selRows);
	}
	
	// 保存崗位設置至數據庫
	var saveJobFunction = function() {
       	var jobjson= [];
       	var hasstationRecord = hasstationStore.getRange();
		if(hasstationRecord.length>0){
            Ext.each(hasstationRecord, function(hasstationRecord){
            	jobjson.push(hasstationRecord.data);
           });
       	}
		Ext.Ajax.request({
        	waitMsg: '正在提交數據',
        	waitTitle: '提示',
        	url: 'personnel_updateJob.action',
        	method: 'post',
        	params:{
        		userid : userid,
        		departmentid : departmentid, 
        		organizeid : organizeid,
        		jobjson : Ext.encode(jobjson)
        	},
        	success:function(response,action){  
        		Ext.Msg.alert('提示','保存成功!');
        		personnelStore.load({
        			params : {
        				limit : pageSize,
        				realname : Ext.getCmp('ser_realname').getValue(),
        				code : Ext.getCmp('ser_code').getValue()
        			}
        		});
        		userJobWin.hide();
            },  
            failure:function(){
                Ext.Msg.alert('提示','保存失敗!');  
            }
    	});
	}
	
	var chooseGrid = new Ext.grid.GridPanel({
		title : '未分配的崗位',width : 250,region : 'west',
		stripeRows : true,autoScroll : true,loadMask : true,
		store : unstationStore,sm : chooseSm,
		cm : new Ext.grid.ColumnModel({
			defaultSortable : 'true',
			columns : [chooseSm,{header : '崗位名稱',dataIndex : 'station',width : 200}]
		})
	});
	
	var buttonPanel = new Ext.Panel({
		region : 'center',layout : 'column',
		items : [{xtype : 'spacer',columnWidth : 1,height : 150},
				{xtype : 'spacer',columnWidth : .05,height : 25},
				{xtype : 'button',columnWidth : .9,anchor:'95%',text : '《',height : 25,handler : removeJobFunction},
				{xtype : 'spacer',columnWidth : .05,height : 25},
				{xtype : 'spacer',columnWidth : 1,height : 5},
				{xtype : 'spacer',columnWidth : .05,height : 25},
				{xtype : 'button',columnWidth : .9,anchor:'95%',text : '》',height : 25,handler : addJobFunction,},
				{xtype : 'spacer',columnWidth : .05,height : 25},
				{xtype : 'spacer',columnWidth : 1,height : 5},
				{xtype : 'spacer',columnWidth : .05,height : 25},
				{xtype : 'spacer',columnWidth : .05,height : 25}]
	});
	
	var allGrid = new Ext.grid.GridPanel({
		title : '所屬崗位',width : 250,region : 'east',
		stripeRows : true,autoScroll : true,loadMask : true,
		store : hasstationStore,sm : allSm,
		cm : new Ext.grid.ColumnModel({defaultSortable : 'true',
			columns : [allSm,{header : '崗位名稱',dataIndex : 'station',width : 200}]
		})
	});
	
	var userJobWin = new Ext.Window({
		frame : true,iconCls : 'user-add',title : '崗位配置',
		constrain : true,layout:'fit',modal: true,width:600,height:400,
        closeAction:'hide',plain: true,
        items: [
        {
        	xtype : 'panel',width: 400,layout : 'border',
        	items : [chooseGrid,buttonPanel,allGrid]   
        }],
        tbar : [{
        	typeAhead: true,triggerAction: 'all',lazyRender:true,anchor:'98%',
	    	xtype : 'combo',fieldLabel :'機構',emptyText:'請選擇機構',editable : true,//禁止編輯
			displayField:'name',valueField: 'id',id : 'organizeid',store: organizeStore,
			listeners:{
                "select":function(combo,record,index){
                	Ext.getCmp('departmentid').clearValue();
                	organizeid = combo.getValue();
                	departmentStore.load({
            			params : {organizeid : organizeid}
            		});
                }
            }
		},{
			typeAhead: true,triggerAction: 'all',lazyRender:true,anchor:'98%',mode:'local',
	    	xtype : 'combo',fieldLabel :'部門',emptyText:'請選擇部門',editable : true,//禁止編輯
			displayField:'name',valueField: 'id',id : 'departmentid',store: departmentStore,
			listeners:{
                "select":function(combo,record,index){
                	departmentid = combo.getValue();
                	unstationStore.load({
                		params : {
                			userid : userid,
                			departmentid : departmentid,
                			organizeid : organizeid
                		}
                	});
                	hasstationStore.load({
                		params : {
                			userid : userid,
                			departmentid : departmentid,
                			organizeid : organizeid
                		}
                	});
                }
            }
		},'->','-',{
			xtype : 'button',text : '取消',iconCls: 'cancle',
			handler : function () {
				userJobWin.hide();
			}
		},'->','-',{
			xtype : 'button',text : '保存',iconCls: 'save',
			handler : function () {
				saveJobFunction();
			}
		}]
    });
	
	// 崗位配置
	function editJobFunction () {
		if(grid.getSelectionModel().getCount()>0){
			var selRecord = grid.getSelectionModel().getSelected();
			userid = selRecord.data['userid'];
			Ext.getCmp('organizeid').clearValue();
			Ext.getCmp('departmentid').clearValue();
			hasstationStore.removeAll();
			unstationStore.removeAll();
			userJobWin.show();
		} else {
			Ext.Msg.alert('提示','請選擇一條記錄!');  
		}
	}

發佈了23 篇原創文章 · 獲贊 2 · 訪問量 4萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章