码迷,mamicode.com
首页 > Web开发 > 详细

extjs4 treepanel 多个checkbox先中 多个节点选中 多级节点展开

时间:2015-08-11 11:41:04      阅读:234      评论:0      收藏:0      [点我收藏+]

标签:

//<%@ page contentType="text/html; charset=utf-8" %>

var checkedNodes = {
    _data:{},
	update:function(id,text,checked){
		if(checked){
			this.add(id,text,checked);
		}else if(!checked){
			this.delById(id);
		}
	},
	clear:function(){
		for(var key in this._data){ 
			delete this._data[key];
		}
		this._data = {};
	},
    add: function(id,text){
       if(!this._data[id]){
			this._data[id] = {‘id‘:id,‘text‘:text};
		}
    },
	delById:function(id){
		if(this._data[id]){
			delete this._data[id];
		}			
	},
	getById:function(id){
		return this._data[id];
	},
	joinId:function(sep){
		arr = [];
		for(id in this._data){
			arr.push(id);
		}
		return arr.join(sep);
	},
	joinName:function(sep){
		arr = [];
		for(id in this._data){
			arr.push(this._data[id].text);
		}
		return arr.join(sep)
	},
	getCheckedOrgIds:function(){
		arr = [];
		for(id in this._data){
			arr.push(id);
		}
		return arr;
	},
	contains:function(id){
		return this_data[id];
	},
	init:function(ids,texts){
		if(ids == ‘‘){
			return ;
		}
		//if(ids.indexOf(‘,‘) > 0){
			idarr = ids.split(‘,‘);
			if(texts){
				textarr = texts.split(‘,‘);
				for(var i=0; i<idarr.length; i++){
					if(idarr[i].replace(/^\s+|\s+$/g,‘‘) != ‘‘){
						this.add(idarr[i],textarr[i]);
					}
				}
			}else{
				for(var i=0; i<idarr.length; i++){
					this.add(idarr[i],null);
				}
			}
		//}
	}
};
var isCheckEvent = false;
var isChecked = false;
	Ext.define(‘OrgInfo‘, {extend: ‘Ext.data.Model‘,
		 fields: [
                  {name: ‘id‘},
                  {name: ‘orgType‘},
                  {name: ‘internalAddress‘},
                  {name: ‘orgCode‘},
                  {name: ‘dateTo‘},
                  {name: ‘orgLeaderNum‘},
                  {name: ‘orgIdParent‘},
                  {name: ‘code‘},
                  {name: ‘orgName‘},
                  {name: ‘text‘, mapping:‘orgName‘},
                  {name: ‘dateFrom‘},
                  {name: ‘orgLevel‘},
                  {name: ‘leaf‘}
         ]
	});
	var orgStore = Ext.create(‘Ext.data.TreeStore‘, {
		defaultRootId: "82",
		model: "OrgInfo",
		root: {id:82,text:‘顺丰速运集团‘,leaf:false},
		proxy: {type:‘ajax‘, actionMethods : "POST", url:‘loadRoleOrg.action‘, reader:{type:‘json‘}},
		nodeParam:‘id‘,
		textField : "name",
		autoLoad:false
	});
	/*
	*设置子节点或者父节点选中的方法
	*设置单个节点选中的方法
	*/
	var TreeNodeCheck ={
		setNodeChecked:function(node,checked){
			checkedNodes.update(node.get(‘id‘),node.get(‘text‘),checked);
			node.set(‘checked‘,checked);
		},
		childChecked:function(node,checked){
			TreeNodeCheck.setNodeChecked(node,checked);
			node.expand(false,function(){
				if(node.hasChildNodes()){
					 node.eachChild(function(child){
						 TreeNodeCheck.childChecked(child,checked);
					 });
				}
			},this);
			
		},
		parentChecked:function(node,checked){
			   var parentNode = node.parentNode;
			   checked = parentNode == null?null:checked;
			   TreeNodeCheck.setNodeChecked(node,checked); //设置父节点不选 中
			   if(parentNode !=null){ //如果父节点不为空则展开
				   var flag = false;
				   parentNode.eachChild(function(child) {
					   if(child.data.checked == true){
						   flag = true;
					   }            
				  });            
				  if(checked == false){
					   if(!flag){
						   	TreeNodeCheck.parentChecked(parentNode,checked);                
						   }            
				  }else{
						if(flag){
							TreeNodeCheck.parentChecked(parentNode,checked);            
				  		}            
				  }         
				}
			   
		}
	};
	   Ext.define("OrgTreePanel", {
	        extend: "Ext.tree.Panel", 
	        store : orgStore,
	        rootVisible: true,
	        useArrows: true,
	        frame : true,
            autoScroll : true,
	        padding:‘10 10 10 10‘,
	        selectIds:function(){
	        	 var records =this.getView().getChecked(),
                 ids = [];
	             Ext.Array.each(records, function(rec){
	                 ids.push(rec.get(‘id‘));
	             });
	             return ids.join(",");
	        },
	        listeners:{
	        	/**itemexpand:function(node,eOpts,aa){
	        		console.info(‘-------------------beforeitemexpand‘);
	        		//isCheckEvent = false;
	        		if(isCheckEvent){
	        			isCheckEvent = null
	        		}else if(isCheckEvent == null){
	        			isCheckEvent = false;
	        		}
	        	},**/
	           	checkchange:function (node,checked,eOpts){
	           		isCheckEvent = true;
	           		isChecked = checked;
	           		TreeNodeCheck.childChecked(node,checked);              
	           		TreeNodeCheck.parentChecked(node,checked);
	           		
	           	},
	        	load:function( store,  records,  successful,  operation,  eOpts ){
	        		/*if(records.data.checked!=null){
	        			console.log("-----------------"+records.data.checked+",isCheckEvent:"+isCheckEvent+",isChecked:"+isChecked);
	        		
	        			if(isCheckEvent || isCheckEvent == null){
	        				
	        			}
	        			Ext.Array.each(successful, function(rec){
       					 TreeNodeCheck.childChecked(rec, isChecked);
	                   	});
	        		}*/
	        		
	          		/*if(records.data.checked!=null){
	          			var hasChecked = false;
	              		Ext.Array.each(successful, function(rec){
	              			if(rec.data.checked){
	              				hasChecked = true;
	              				return false;
	              			}
	                   	});
	              		if(!records.data.checked){
	              			if(hasChecked){
	        	        			Ext.Array.each(successful, function(rec){
	        	        					 TreeNodeCheck.childChecked(rec,false);
	        		             	});
	              			}
	              		}else{
	              			if(!hasChecked){
	              				Ext.Array.each(successful, function(rec){
	              						 TreeNodeCheck.childChecked(rec,true);
	        		             	});
	              			}
	              		}
	          		}*/
	        	}
	        }
	    });
	   
	 

  

extjs4 treepanel 多个checkbox先中 多个节点选中 多级节点展开

标签:

原文地址:http://www.cnblogs.com/xunianchong/p/4720099.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!