選中並取消選中樹節點中的節點

Question

要做的事：檢查孩子應該檢查父母的樹，清除父母複選框應清除所有的孩子。

實施例：

parent1
--child1
--child2
          --subChild1
          --subChild2

場景1：在上述情況下，如果subChild1被選中，那麼parent1和child2也應該被檢查。

Scenario2：如果parent1被選中，那麼它的所有兒童（檢查）應選中。

從此Check/Uncheck Nodes，只有當選擇父節點時，其子節點纔會被選中。

他們的東西Implemeted一個我想要的方式，但無法弄清楚（執行）的複雜程度足夠高，讓我understand.Here是reference

請幫我解決了這個功能。謝謝。任何幫助，將不勝感激。

Answer 1

這裏是我有什麼done.It花了一些時間，但它的工作。

checkchange : function(node, checked, opts) { 

function clearNodeSelection(node){ 
    //node is not leaf node 
    console.log(node); 
    leafNode = node.raw.leaf; 
    if(!leafNode){ 
     node.cascadeBy(function(node) { 
      node.set('checked', false); 
     }) 
    } 
} 

if(!checked){ 
    console.log("inside !checked : "+checked); 
    clearNodeSelection(node); 
} 

function selectParentNodes(node){ 
    var parentNode = node.parentNode; 
    if(parentNode){ 
     parentNode.set('checked', true); 
     selectParentNodes(parentNode); 
    } 
} 

selectParentNodes(node); 
} 

Atlast，Thanks @VDP。 '太棒了'太棒了。

Answer 2

這裏你去！ Working fiddle

=>您添加的偵聽器checkchange，檢查它是否具有的childNodes如果是這樣設置的的childNodes

值

注：檢查數據有checked: false參數啓用的複選框。 （如果不通過後端發送您可以將它添加到你的模型並將其設置爲默認強制）

var store = Ext.create('Ext.data.TreeStore', { 
    root: { 
     expanded: true, 
     children: [ 
      { text: "detention", leaf: true, checked: false }, 
      { text: "homework", expanded: true, children: [ 
       { text: "book report", leaf: true, checked: false }, 
       { text: "algebra", leaf: true, checked: false} 
      ], checked: false }, 
      { text: "buy lottery tickets", leaf: true, checked: false } 
     ] 
    } 
}); 

Ext.create('Ext.tree.Panel', { 
    title: 'Simple Tree', 
    width: 200, 
    height: 150, 
    store: store, 
    rootVisible: false, 
    renderTo: Ext.getBody(), 
    listeners: { 
     checkchange: function(node, checked, eOpts){ 
      if(node.hasChildNodes()){ 
       node.eachChild(function(childNode){ 
        childNode.set('checked', checked); 
       }); 
      } 
     } 
    } 

});