TreeView checkbox 全选

在使用TreeView 控件 ，进行权限管理的时候，需要使用 checkbox全选。

勾选父节点，子节点全部选中。取消父节点，子节点不选中。

勾选子节点，父节点也选中。

以下是在使用的例子：

<asp:TreeView ID="TVPermission"  runat="server" NodeIndent="20" Target="mainFrame" ExpandDepth="2"  ShowCheckBoxes="All"/>

TreeView 控件

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {            TVPermission.Attributes.Add("OnClick","OnTreeNodeChecked()");
        }
    }

页面加载

 1 <script type ="text/javascript" >
 2     function OnTreeNodeChecked() {
 3         var ele = event.srcElement;
 4         if (ele.type=='checkbox') {
 5             var childrenDivID = ele.id.replace('CheckBox', 'Nodes');
 6             var div = document.getElementById(childrenDivID);
 7 
 8             if (div != null) {
 9                 var checkBoxs = div.getElementsByTagName("INPUT");
10                 for (var i = 0; i < checkBoxs.length; i++) {
11                     if (checkBoxs[i].type == 'checkbox') {
12                         checkBoxs[i].checked = ele.checked;
13                     }
14                 }
15             }
16             CheckOn(ele);
17         }
18     }
19     function CheckOn(obj) {
20         var div1 = WebForm_GetParentByTagName(obj, 'DIV');
21         if (div1 != null) {
22             var checkBoxs = div1.getElementsByTagName('INPUT');
23             var parentCheckBoxID = div1.id.replace('Nodes', 'CheckBox');
24             var parentCheckBox = document.getElementById(parentCheckBoxID);
25 
26             if (parentCheckBox != null) {
27                 parentCheckBox.checked = true;
28                 CheckOn(parentCheckBox);
29                 CheckOn(parentCheckBox);
30             }
31         }
32     }
33 </script>

前端脚本

 

转载于:https://www.cnblogs.com/weiqinl/p/4710217.html