ExtJs 实现select列表选中项时添加删除

昨天空闲的时候，弄了一下双向链表的例子，供大家参考，匆忙做的，如果有问题请及时回复,部分代码以打包的形式上传。

Ext.namespace('Ext.role');
Ext.role.rights = function() {
	/* ----------------------- private属性 ----------------------- */
	var win, okBtn, cancelBtn, nav, tn = 1, sysId; 

	/* ----------------------- private方法 ----------------------- */
	// 创建表格
	function createGrid(){
		var store = new Ext.data.Store({
			proxy:  new Ext.data.HttpProxy({
            	url: attrCurrMgr.Contants.selectOrgGridLoadUrl
            }),
		    // 返回数据解析器配置
		    reader: new Ext.data.JsonReader(
		    	{   
		        	root:'data',  
		        	totalProperty:'totalCount',
		        	id: 'roleId'
		         }, 
		        [	{name: 'roleId', mapping: 'roleId'},
            		{name: 'roleName', mapping: 'roleName'}
        		]
        	)
    	});
		attrCurrMgr.Contants.selectOrgGrid = new Ext.grid.GridPanel({
		    el: 'selectOrgGrid_div',
	        store: store,
	        loadMask: true,
	        //bodyStyle:'width:100%', 
	        //height: 400,
	        cm: new Ext.grid.ColumnModel([
			{header: "角色名称", id:'orgName', width: 200, sortable: true, locked:false, dataIndex: 'roleName'}
	        ]),
	        tbar: new Ext.Toolbar({items:[{id:'delrightbutton',text:"删除角色",handler: delRightClick},'-']}),
	        sm: new Ext.grid.RowSelectionModel({singleSelect:false})
    	});
    	
    	attrCurrMgr.Contants.selectOrgGrid.render(); 
	}
	//删除角色权限
	function delRightClick(){
	 	var c = attrCurrMgr.Contants.selectOrgGrid.getSelectionModel().getSelections();
       	if (c.length > 0) 
       		Ext.MessageBox.confirm('消息', '确认要删除所选记录?', doDelete);
       	else 
          	Ext.MessageBox.alert('警告', '最少需要选择一条记录!');    
	}
	function doDelete(btn){
	  	if(btn == 'yes') {	
			var m = attrCurrMgr.Contants.selectOrgGrid.getSelectionModel().getSelections();
			var jsonData ="";
	        for(var i = 0, len = m.length; i < len; i++){        		
				var ss =  m[i].get('roleId');
				if(i==0)
	           		jsonData = jsonData + ss ;
			   	else
					jsonData = jsonData + "," + ss;							
	        }
            // 提交删除的参数配置
			var config = {
				url : attrCurrMgr.Contants.SelectOrgDelUrl,
				failure: function() {
					Ext.MessageBox.alert('错误信息', '删除选择的角色失败!');
				},
	            success: function(){
				    Ext.MessageBox.alert('消息', '删除选择的角色成功!');   
	            },
	            callback: function(){            	
	            	attrCurrMgr.Contants.selectOrgGrid.store.load();
	            },            
	            method: 'POST',
	            params:{delData:jsonData}	
			};
			this.transId = Ext.Ajax.request(config);				
		}
    }	
  
	// 创建窗口
	function createWindow() {
		if (win) return;
		attrCurrMgr.Contants.treePanel = new RoleTreePanel();
		win = new Ext.Window( {
			minimizable: true,
			iconCls : 'bdSelector',
			header:true,
			title:'角色设置',
			shadow:true,
			closable:true,
			resizable:false,
			animCollapse: true,
    		closeAction: 'hide',
			width: 580,
			height: 530,
			layout : 'border',
			plain : true,
			modal : true,
			items : [
				attrCurrMgr.Contants.treePanel,  
				{   region: 'center',
            		split:false,
		            border:false,
		            layout:'fit',
		            items:[{contentEl: 'right-center'}]
				},
			    {   region:"east",
				    contentEl:'right-east',
				    width: 225,
				    layout:'fit',
				    items:attrCurrMgr.Contants.selectOrgGrid
				}]
		});
		win.on('show', function() {
			attrCurrMgr.Contants.treePanel.reset();
			attrCurrMgr.Contants.selectOrgGrid.store.baseParams={sysId:sysId};
			attrCurrMgr.Contants.selectOrgGrid.store.load();
		});		
		win.on('minimize', function(){
    		win.toggleCollapse();
		});

		cancelBtn = win.addButton( {
			text : '关闭',
			tabIndex : tn++
		}, onWinHide, this);
	}
	// 隐藏窗口
	function onWinHide() {
		win.hide();
	}	

	/* ----------------------- public方法 ----------------------- */
	return {
		showDialog : function(obj) {
		    if(obj.sysId) sysId = obj.sysId;
		    else sysId = undefined;
		    attrCurrMgr.curSysId = sysId;
			if(!attrCurrMgr.Contants.selectOrgGrid) createGrid();     //创建表格,不存在才创建
			createWindow();   //创建window
			win.show(obj.td);
			if (!nav) nav = new Ext.KeyNav(win.getEl(), {"esc" : onWinHide});
		}
	}; // return
}();	


/**
* 普通权限树
**/
RoleTreePanel = function() {
    RoleTreePanel.superclass.constructor.call(this, {
        region: 'west',
        layout: 'fit',
        width: 240,
        el:'orgTree_div',
        collapsible: true,
        split:true,
        margins:'3 0 3 3',
        cmargins:'0 0 0 0',
        lines:true,
        autoScroll:true,
        rootVisible:false,
        loader: new Ext.tree.TreeLoader({
        	dataUrl: attrCurrMgr.Contants.orgTreeLoadUrl,
        	baseParams: {parentId: attrCurrMgr.Contants.rootNodeRoleId}
        }),  
        root: new Ext.tree.AsyncTreeNode({
        	text: '角色选择',
        	draggable:false,
        	expanded:true,
        	iconCls : 'iconleaf',
        	id: attrCurrMgr.Contants.rootNodeRoleId
    	})
    });
    this.on('beforeload', function(node){
       	this.loader.baseParams.parentId = node.id;
    });
    // 注册事件,点击树时刷新表格并设置当前活动节点
  	this.on('click',  function(node, e){
		this.currentNode = node;
		attrCurrMgr.Contants.nodeId = node;
  	});
    //new Ext.tree.TreeSorter(this, {folderSort:true});
};
Ext.extend(RoleTreePanel, Ext.tree.TreePanel, {
	currentNode: undefined,
	////重置树，如果选择了，则要去掉
	reset:function() {
//	    var selectNodeIds = this.getChecked();
//	    if(selectNodeIds.length>0) {
//	    	for(var i=0;i<selectNodeIds.length;i++) {
//	    		var node = this.getNodeById(selectNodeIds[i]);
//	    		if(node.attributes.checked) {
//	    			node.getUI().checkbox.checked = false;   //设置ui
//	    			node.attributes.checked = false;         //设置checked为false，否则取数据时还是选择了
//	    		}
//	    	}
//	    }
	}
});
//Ext.override(Ext.tree.TreeNodeUI, { 
//	onClick : function(e){ 
//		var checked = this.checkbox.checked;
//		this.checkbox.defaultChecked = checked;
//        this.node.attributes.checked = checked;
//		this.fireEvent('checkchange', this.node, this.checkbox.checked); 
//	} 
//});

这个发现还挺有意思的。