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

//<%@ 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);
	        		             	});
	              			}
	              		}
	          		}*/
	        	}
	        }
	    });

  

时间: 2024-10-31 14:46:15

extjs4 treepanel 多个checkbox先中 多个节点选中 多级节点展开的相关文章

[extjs] ExtJS4 treepanel 子节点选中父节点自动选中,选中父节点 子节点自动全部选中

ExtJS4 treepanel 主要添加viewConfig重的代码: xtype:'treepanel', store: menuStore, id:'menuTreePanel', viewConfig : { //checkbox联动 onCheckboxChange : function(e, t) { var item = e.getTarget(this.getItemSelector(), this.getTargetEl()), record; if (item){ recor

判断复选框中是否有被选中的代码实例

判断复选框中是否有被选中的代码实例:复选框中一般多项,有时候我们需要判断这些付选中是否有被选中的项,下面就通过一个实例简单介绍一下如何实现此效果.代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"/> <meta name="author" content="http://www.softwhy.com/" /> <t

解决在IE下label中IMG图片无法选中radio的几个方法

今天遇到一个问题,在IE浏览器下,使用label FOR radio后,label中的图片无法选中.例如,这样的代码 <input type="radio" name="radio" id="a" /><label for="a"><img src="/Labs/images/logo.gif" /></label> ,这种情况下,点击label的图片将无法选

关于JS中查看当前节点的兄弟节点的使用

<tr> <td align="center"><input style="width: 20px;" type="checkbox" name="ck" /></td> <td align="left"><input name="wgrkbillentry[0].fitemid" maxlength="50&q

ZigBee中协调器如何向子节点发消息?

注意:以下所有内容均以TI公司的CC2530和Z-Stack为硬软件平台为实验背景讲述. 在一般的ZigBee教程中,子节点如何向协调器发送消息已经被描述的非常清楚了:即子节点直接使用API向地址为0x0000的协调器发送消息即可.用到的函数如下: afStatus_t AF_DataRequest( afAddrType_t *dstAddr, endPointDesc_t *srcEP,uint16 cID, uint16 len, uint8 *buf, uint8 *transID,ui

关于Toolbar中navigationIcon和title之间距离及展开

关于Toolbar中navigationIcon和title之间距离及展开 问题缘起 在进行Coolcode项目的MyclassActivity中,我发现navigationIcon和title之间的实际间距与UI图不符,虽然康桐说不需要改,但是出于好奇心我还是希望明白其中原因. 问题分析 由于学习Android时间不长,无法一步直指问题所在,所以我们就从和Toolbar有关的所有代码里面一个个找(在myclasses里面). 首先我们在MyClassActivity中首次调用了BaseActi

DOM中元素节点、属性节点、文本节点的理解

转自:http://www.cnblogs.com/dh616854836/archive/2011/08/14/2138038.html 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是: nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可返回节点的类型. 最重要的节点类型是: 元素类型 节点类型 元素 1 属性 2 文本 3 注释 8 文档 9 在实际应用中,经常用到的就是元素节点.属性节点和文

[转]XML中元素(Element)与节点(Node)的区别

前言: element是特殊的node 一段纯文本即text-node也是node 但不是element w3c的原话是 A node can be an element node, an attribute node, a text node, or any other of the node types explained in the "Node types" chapter. 一.xmlnode类节点: xmlnode类表示xml文档中的单个节点,其命名空间为:System.X

求二叉树中相差最大的两个节点间的差值绝对值

题目描述: 写一个函数,输入一个二叉树,树中每个节点存放了一个整数值,函数返回这棵二叉树中相差最大的两个节点间的差值绝对值.请注意程序效率. solution: int findMinMax(BTNode *T) { if(!T) return 0; int max = INT_MIN; int min = INT_MAX; stack<BTNode*> s; s.push(T); while (!s.empty()) { BTNode *tmp = s.top(); if(tmp->d