• bootstrap-treeview的完善(父子节点的全选与反选)


    效果图

     1 // 选中父节点时,选中所有子节点
     2     function getChildNodeIdArr(node) {   
     3         var ts = [];  
     4         if (node.nodes) {    
     5             for (x in node.nodes) {     
     6                 ts.push(node.nodes[x].nodeId);     
     7                 if (node.nodes[x].nodes) {      
     8                     var getNodeDieDai = getChildNodeIdArr(node.nodes[x]);      
     9                     for (j in getNodeDieDai) {       
    10                             ts.push(getNodeDieDai[j]);     
    11                     }     
    12                 }    
    13             }   
    14         } else {    
    15             ts.push(node.nodeId);   
    16         }   
    17         return ts;  
    18     }   
     1 // 选中所有子节点时,选中父节点 取消子节点时取消父节点
     2     function setParentNodeCheck(node) {   
     3         var parentNode = $("#treeview-checkable").treeview("getNode", node.parentId);   
     4         if (parentNode.nodes) {    
     5             var checkedCount = 0;    
     6             for (x in parentNode.nodes) {     
     7                 if (parentNode.nodes[x].state.checked) {      
     8                     checkedCount ++;     
     9                 } else {      
    10                     break;     
    11                 }    
    12             }    
    13             if (checkedCount == parentNode.nodes.length) {  //如果子节点全部被选 父全选
    14                 $("#treeview-checkable").treeview("checkNode", parentNode.nodeId);
    15                 setParentNodeCheck(parentNode);    
    16             }else {   //如果子节点未全部被选 父未全选
    17                 $('#treeview-checkable').treeview('uncheckNode', parentNode.nodeId); 
    18                 setParentNodeCheck(parentNode);        
    19             }   
    20         }  
    21     }     
     1 // 取消父节点时 取消所有子节点
     2     function setChildNodeUncheck(node) { 
     3         if (node.nodes) {   
     4             var ts = [];    //当前节点子集中未被选中的集合 
     5             for (x in node.nodes) { 
     6                 if (!node.nodes[x].state.checked) {  
     7                     ts.push(node.nodes[x].nodeId);  
     8                 } 
     9                 if (node.nodes[x].nodes) {      
    10                     var getNodeDieDai = node.nodes[x];
    11                     console.log(getNodeDieDai);      
    12                     for (j in getNodeDieDai) {
    13                         if (!getNodeDieDai.nodes[x].state.checked) {        
    14                             ts.push(getNodeDieDai[j]); 
    15                         }    
    16                     }     
    17                 }    
    18             }   
    19         }
    20         return ts;  
    21     }
     1 onNodeChecked: function(event, node) { //选中节点 
     2                 var selectNodes = getChildNodeIdArr(node); //获取所有子节点      
     3                 if (selectNodes) { //子节点不为空,则选中所有子节点       
     4                     $('#treeview-checkable').treeview('checkNode', [selectNodes, { silent: true }]);     
     5                 }     
     6                 var parentNode = $("#treeview-checkable").treeview("getNode", node.parentId);      
     7                 setParentNodeCheck(node);   
     8           },    
     9           onNodeUnchecked: function(event, node) { //取消选中节点  
    10                 // 取消父节点 子节点取消
    11                 var selectNodes = setChildNodeUncheck(node); //获取未被选中的子节点 
    12                 var childNodes = getChildNodeIdArr(node);    //获取所有子节点 
    13                 if (selectNodes && selectNodes.length==0) { //有子节点且未被选中的子节点数目为0,则取消选中所有子节点   
    14                   console.log("反选");   
    15                   $('#treeview-checkable').treeview('uncheckNode', [childNodes, { silent: true }]);      
    16                 }  
    17                 // 取消节点 父节点取消
    18                 var parentNode = $("#treeview-checkable").treeview("getNode", node.parentId);  //获取父节点
    19                 var selectNodes = getChildNodeIdArr(node);     
    20                 setParentNodeCheck(node); 
    21           }   
    22         });

    以上部分是本人研究,有错漏之处请见谅/ *-*/.....

  • 相关阅读:
    javascript 基础知识汇总(一)
    一个高效单表分页查询语句
    Linux的基本操作(一)
    Tomcat服务器配置
    C# — Winform的TextBox控件实现记忆功能
    C# — LINQ To XML示例
    C# — COM组件注册
    C# — LINQ查询的简单使用
    C# — 题库答案汇总
    C# — 题库汇总
  • 原文地址:https://www.cnblogs.com/happyguo/p/7338136.html
Copyright © 2020-2023  润新知