ExtJS Tree刷新後只選擇節點，不展開（二）

 ExtJS Tree刷新後只選擇節點，不展開（二）

 

實例講解：點擊觸發域（Ext.form.TriggerField）三角按鈕，彈出樹面板窗口，並將觸發域中的內容在樹面板中選中。

 

1.點擊觸發域獲取觸發域中的內容：

policyTg.onTriggerClick=policytrigFun;

function policytrigFun(e){
	policyWin.show();//注：窗口顯示的時候，會去加載樹！
	policys = policyTg.getValue();//獲取觸發域中的文字內容
	var parentNodes = policy_root.childNodes;//根節點下的目錄
	if(parentNodes.length > 0) {//因爲窗口剛剛展開的時候，樹還未加載完，所以length = 0
		showCheckedPolicys(parentNodes);
	}
	else {
		loadPolicys();
	}
}

 

2.加載樹，並執行加載成功事件的方法：

function loadPolicys(){
	ploader.on("load",function(treeLoader,node){//此時的node是root根節點——因爲是一次性加載完的！！！
		showCheckedPolicys(node.childNodes);
	});
}

 

3.顯示被勾選的內容：

/*顯示被勾選的內容*/
function showCheckedPolicys(parentNodes){
	//先展開再收縮父節點，讓子節點充分顯示
	for (var i = 0; i < parentNodes.length; i++) {
		parentNodes[i].expand();//將各級進行展開
		parentNodes[i].collapse();
	}
	//再將所有節點的選擇框給清楚掉
	for (var i = 0; i < parentNodes.length; i++) {
		var childNodes = parentNodes[i].childNodes;
		for (var j = 0; j < childNodes.length; j++) {
			childNodes[j].ui.toggleCheck(false);
		}
	}
	//將觸發域中獲取的相關內容字符串分割爲一個數組
	var policyArr = policys.split(",");
	if(!policyArr || policyArr == ""){
		return;
	}
	//循環對比，相對應的進行勾選
	for (var i = 0; i < parentNodes.length; i++) {
		var childNodes = parentNodes[i].childNodes;
		for (var j = 0; j < childNodes.length; j++) {
			var policyText = childNodes[j].text;//將觸發域的內容和樹節點顯示的內容進行對比
			for (var k = 0; k < policyArr.length; k++) {
				if(policyArr[k] == policyText) {
					childNodes[j].ui.toggleCheck(true);
				}
			}
		}
	}
}

 

注意：

1.將觸發域內容和樹節點顯示的內容進行對比。

2.注意勾選是TreeNodeUI的功能，不是TreePanel的功能，也不是TreeNode的功能

 

圖示：