extjs 樹節點操作

tree :樹    node:節點

1、全部展開 tree.expandAll();
2、全部收縮 tree.collapseAll();
3、得到父節點 node.parentNode
4、判斷是否有父節點 node.parentNode==null
5、判斷是否有子節點 node.hasChildNodes()
6、獲取下一級所有子節點 node.eachChild(function(child) { })
7、獲取選擇的節點 tree.getSelectionModel().getSelectedNode()
8、設置選中節點  node.select()
9、上移節點 node.selectPrevious();
10、下移節點 node.selectNext();
11、獲取節點ID  node.id
12、獲取節點值  node.text
13、獲取節點提示  node.attributes.qtip

帶選擇框
14、獲取選中的的節點
var check= tree.getChecked();
Ext.each(check ,function(node){})

15、獲取是否選擇  node.getUI().checkbox.checked;
16、設置節點選擇   node.ui.toggleCheck(true);  //顯示選中    node.attributes.checked = true; //賦值

 


17、設置一個新的節點 
var newNode=new Ext.tree.TreeNode({id:'id',text:'text',iconCls:'icon-group',qtip:'tip'});      iconCls 導入的是CSS設置的背景圖片(節點圖標)
css寫法: .x-tree-node-leaf .icon-group{  background-image:url(group.png);} 前.x-tree-node-leaf必寫

18、插入新的節點  node.appendChild(newNode);
19、刪除節點 node.remove(); 

項目中通常獲取節點選中父節點或全部子節點(代碼如下): 

tree.on('checkchange', function(node) { 
	 tree.suspendEvents(); //暫停所有監聽事件的執行
     treeclick(node);
     parentclick(node);
     tree.resumeEvents();  //重新開始所有監聽事件的執行   
	}, tree);
	//選中父節點
function parentclick(node){
	   var parentNode = node.parentNode;//獲取父節點
              if (parentNode != null) {
                  var isNotChecked = false;
                  var someChecked = false;
                  var childCount = parentNode.childNodes.length;
                  for (var i = 0; i < childCount; i++) {
                      var child = parentNode.childNodes[i];
                      if (child.attributes.checked) {
                          someChecked = true;
                      } else {
                    	  isNotChecked = true;
                      }
                  }
                   if (someChecked) {
                      parentNode.attributes.checked = true;
                      parentNode.ui.toggleCheck(true);
                  }
                 else if (isNotChecked) {
                      parentNode.attributes.checked = false;
                      parentNode.ui.toggleCheck(false);
                  }
  
                  parentclick(parentNode);//遞歸選中父節點
              }
}
//選擇子節點
function treeclick(node){  
	 var isChecked = node.attributes.checked;//獲取選中狀態
     if (node.hasChildNodes()) {                 //是否有子節點
       node.eachChild(function(child) {         //循環下一級的所有子節點
           child.ui.toggleCheck(isChecked);          //選中
           child.attributes.checked = isChecked;     //賦值
            treeclick(child);                   //遞歸選中子節點
        });
     }
}

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