zoukankan      html  css  js  c++  java
  • (javascript,treeview)treeview通过checkbox来进行全选单选

    from:http://blog.csdn.net/netjxz/archive/2007/07/18/1696552.aspx
    Treeview如何支持全选和单选,以及获取相关的节点id值,经过自己的修改改为针对3级目录,其中提供选择的是2和3级目录,我的代码如下(其中还需要一个selectID的hidden input控件)
      1 
      2             //根据已选择的节点的字符串初始化选择的节点
      3             function findAndCheckedNodes(NodeArray,nodeDatas)
      4             {
      5                  if(parseInt(NodeArray.length)==0)
      6                  {
      7                     return;
      8                 }
      9                 else
     10                 {
     11                     for(var i=0;i<parseInt(NodeArray.length);i++)
     12                     {
     13                         var cNode,nodeData;
     14                         cNode=NodeArray[i];
     15                         ////如果该节点在nodeDatas里则初始化checked = true;
     16                         nodeData = cNode.getAttribute("NodeData");
     17                         for(var j=0;j<nodeDatas.length;j++)
     18                         {
     19                             if(nodeDatas[j] == nodeData)
     20                             {
     21                                 cNode.setAttribute("checked","true");
     22                                 break;
     23                             }
     24                         }
     25                         //如果有子节点,则继续递归
     26                         if(parseInt(cNode.getChildren().length)!=0)
     27                         findAndCheckedNodes(cNode.getChildren(),nodeDatas);    
     28                     }
     29                 }
     30             }
     31             
     32             //节点的oncheck事件
     33             function tree_oncheck(tree)
     34             {
     35                 var node=tree.getTreeNode(tree.clickedNodeIndex);
     36                 var Pchecked=tree.getTreeNode(tree.clickedNodeIndex).getAttribute("checked");
     37                 setcheck(node,Pchecked);
     38                 setParent(node,Pchecked);//如果是选择那么选择其父接点.
     39                 document.getElementById('selectID').value ='';
     40                 FindCheckedFromNode(TvwCategorys);
     41             }
     42             //设置子节点选中
     43             function setcheck(node,Pc)
     44             {
     45                 var i;
     46                 var ChildNode=new Array();
     47                 ChildNode=node.getChildren();
     48                  
     49                 if(parseInt(ChildNode.length)==0)
     50                     return;
     51                 else
     52                 {
     53                     for(i=0;i<ChildNode.length;i++)
     54                     {
     55                         var cNode;
     56                         cNode=ChildNode[i];
     57                         if(parseInt(cNode.getChildren().length)!=0)
     58                             setcheck(cNode,Pc);
     59                         cNode.setAttribute("checked",Pc);
     60                     }
     61                 }
     62             }
     63             //获取所有节点状态
     64             function FindCheckedFromNode(node) 
     65             {
     66                 var i = 0;
     67                 var nodes = new Array();
     68                 nodes = node.getChildren();
     69                  
     70                 for (i = 0; i < nodes.length; i++
     71                 {
     72                     var cNode;
     73                     cNode=nodes[i];
     74                     if (cNode.getAttribute("checked"))
     75                         AddChecked(cNode);
     76                     else
     77                         AddUnChecked(cNode);
     78                       
     79                     if (parseInt(cNode.getChildren().length) != 0 ) 
     80                     {
     81                         FindCheckedFromNode(cNode);
     82                     }
     83                 }
     84             }
     85             //添加选中节点
     86             function AddChecked(node) 
     87             {
     88                 var selectID = document.getElementById("selectID").value;
     89                 if(node.getAttribute("Type"=="sub" && selectID.indexOf(node.getAttribute("NodeData"))<0)
     90                 document.getElementById("selectID").value += node.getAttribute("NodeData")+",";
     91             }
     92             //添加未选中节点
     93             function AddUnChecked(node)
     94             {          
     95                 var selectID = document.getElementById("selectID").value;
     96                 if(node.getAttribute("Type"=="sub" && selectID.indexOf(node.getAttribute("NodeData"))>=0)
     97                     selectedID.replace(","+curID+",",",");
     98                 document.getElementById("selectID").value = selectID;
     99             }
    100             
    101             //设置子节点选中/取消;
    102 //同时需要设置父节点的状态(如果是取消选中的话,仅仅设置本节点及其所有字接点,不涉及父接点)
    103             function setParent(node,Pc)
    104             {
    105                 var parentNode = node.getParent();
    106                 if(parentNode)
    107                 {    
    108                     var parentNodeFather = parentNode.getParent();
    109                     if(parentNodeFather)
    110                     {
    111                         setParent(parentNode,Pc);
    112                     }
    113                     if(Pc)
    114                     {parentNode.setAttribute("checked",Pc);}
    115                     else
    116                     {
    117                         checkBrother(parentNode,Pc,node.getAttribute("NodeData"))
    118                     }
    119                 }
    120             }
    121             
    122 //检查子接点是否有选择的,如果有一个选择了,那返回true
    123 //只查第一级节点.
    124 function checkBrother(parentNode,Pc,nodeData)
    125 {
    126     var childNodes = new Array();
    127     childNodes = parentNode.getChildren();
    128     if(childNodes.length >0)
    129     {
    130         var bChecked = true;
    131         for(var i=0;i<childNodes.length;i++)
    132         {
    133             if(childNodes[i].getAttribute("checked"== true &&  childNodes[i].getAttribute("NodeData"!= nodeData)
    134             {
    135                 //alert(i+childNodes[i].getAttribute("Text"));
    136                 bChecked = false;
    137                 break;
    138             }
    139         }
    140         if(bChecked)
    141         {
    142             parentNode.setAttribute("checked",Pc);
    143         }
    144         else
    145         {
    146             //所有父结点选择
    147             setParent(parentNode,!Pc)
    148         }
    149     }
    150     else
    151     {
    152         parentNode.setAttribute("checked",Pc);
    153     }
    154 }
    155    
  • 相关阅读:
    PAT (Advanced Level) Practice 1100 Mars Numbers (20分)
    PAT (Advanced Level) Practice 1107 Social Clusters (30分) (并查集)
    PAT (Advanced Level) Practice 1105 Spiral Matrix (25分)
    PAT (Advanced Level) Practice 1104 Sum of Number Segments (20分)
    PAT (Advanced Level) Practice 1111 Online Map (30分) (两次迪杰斯特拉混合)
    PAT (Advanced Level) Practice 1110 Complete Binary Tree (25分) (完全二叉树的判断+分享致命婴幼儿错误)
    PAT (Advanced Level) Practice 1109 Group Photo (25分)
    PAT (Advanced Level) Practice 1108 Finding Average (20分)
    P6225 [eJOI2019]异或橙子 树状数组 异或 位运算
    P4124 [CQOI2016]手机号码 数位DP
  • 原文地址:https://www.cnblogs.com/ocean2000/p/888509.html
Copyright © 2011-2022 走看看