ExtJS学习笔记-复选框tree的父子节点联动

• 选择父节点，所有子节点也被选中

  tree.on('checkchange',function(node,flag){
      node.expand();
      node.attributes.checked=flag;
      //所有子节点被选中
      node.eachChild(function(child){
            child.ui.toggleCheck(flag);
            child.attributes.checked=flag;
            child.fireEvent('checkchange',child,flag);
      });
  },tree);

• 选择子节点，父节点也被选中

  tree.on('checkchange', function(node, flag) {  
                  if(node.parentNode.id!='root'){//判断是否是root节点
                           //如果该节点的父节点和子节点被选中继续选中
                            if(flag||tree.getChecked(id,node.parentNode)==""){
                               node.parentNode.ui.toggleCheck(flag);
                               node.parentNode.attributes.checked=flag;
                               node.parentNode.fireEvent('checkchange',node.parentNode,flag);//递归调用
                            }
                   }
              }, tree); 
  

• 前面两点都是在网上找的资源，最后这一点，只是把上面的结合一下就实现了：父子节点联动

  tree.on('checkchange',function(){
    if(node.hasChildNodes()){
         node.cascade(function(node){
              node.attributes.checked=flag;
              node.ui.checkbox.checked=flag;
              return true;
         });
  
         var pNode = node.parentNode;
          for(;pNode.id!='root';pNode=pNode.parentNode){
              if(flag|| tree.getChecked(id,node.parentNode)==""){
                      pNode.ui.checkbox.checked=flag;
                      pNode.attributes.checked=false;
                 }
          }
    }else{
           if(flag&&node.parentNode.id!='root'){
                node.parentNode.ui.checkbox.checked=flag;
                node.parentNode.attributes.checked=false;
            }else{
                 node.ui.checkbox.checked=flag;
                 node.attributes.checked=flag;
             }
     }
  });

• 总结说明：因为项目中用到ExtJS的tree，而我又负责这个树，所以结合网上的资料和自己项目中具体情况，调试修改得到第三点。仅是为了防止遗忘，方便以后查阅。——好脑瓜，不如烂笔头！

评论

2 楼 BearbabyCC 2016-05-16  

我试了怎么不行，我用的是EXTJS3.2

1 楼 superchinaren 2012-11-16  

这是EXT3以下的应用方式。建议写写EXT4的。变化很大。