Web 表单中的 Treeview 检查父节点上的子节点检查答案

【问题标题】：Treeview in web form check child nodes on parent node checkWeb 表单中的 Treeview 检查父节点上的子节点检查
【发布时间】：2011-08-23 07:58:11
【问题描述】：

我使用 System.Web.UI 类的 Treeview 控件来显示项目的类别和子类别。

我尝试了以下代码但没有希望

        protected void tvwOrganisation_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)
        {
            if (tvwOrganisation.CheckedNodes.Count > 0)
            {
                // the selected nodes.
                foreach (TreeNode node in tvwOrganisation.CheckedNodes)
                {

                    if (node.ChildNodes.Count > 0)
                    {
                        foreach (TreeNode childNode in node.ChildNodes)
                        {
                            childNode.Checked = true;
                        }
                    }

                }

            }
}

有什么办法可以做到这一点，我也尝试过javascript。

还有什么是 AfterCheck - web 表单中的 windows formd 事件的替换。

【问题讨论】：

从这个线程stackoverflow.com/questions/1437617/…获取代码
你为什么不在这里发布你的答案并接受它？
@AYK，发布答案并接受:)
@AYK：如果你想运行服务器端代码，那你为什么要写那么多javascript代码
@Naresh，我想你在评论中错误地提到了我？

标签： c# asp.net treeview webforms

【解决方案1】：

树标签如下，

 <asp:TreeView ID="tvwRegionCountry" runat="server" ShowCheckBoxes="All" ExpandDepth="0"   AfterClientCheck="CheckChildNodes();" PopulateNodesFromClient="true" ShowLines="true" ShowExpandCollapse="true" OnTreeNodeCheckChanged="tvwRegionCountry_TreeNodeCheckChanged"
                                                    onclick="OnTreeClick(event)">
                                                </asp:TreeView>

添加了asp.net treeview checkbox selection中提到的以下JS

<script language="javascript" type="text/javascript">
    function OnTreeClick(evt) {
        var src = window.event != window.undefined ? window.event.srcElement : evt.target;
        var isChkBoxClick = (src.tagName.toLowerCase() == "input" && src.type == "checkbox");
        if (isChkBoxClick) {
            var parentTable = GetParentByTagName("table", src);
            var nxtSibling = parentTable.nextSibling;
            if (nxtSibling && nxtSibling.nodeType == 1)//check if nxt sibling is not null & is an element node
            {
                if (nxtSibling.tagName.toLowerCase() == "div") //if node has children
                {
                    //check or uncheck children at all levels
                    CheckUncheckChildren(parentTable.nextSibling, src.checked);
                }
            }
            //check or uncheck parents at all levels
            CheckUncheckParents(src, src.checked);
        }
    }

    function CheckUncheckChildren(childContainer, check) {
        var childChkBoxes = childContainer.getElementsByTagName("input");
        var childChkBoxCount = childChkBoxes.length;
        for (var i = 0; i < childChkBoxCount; i++) {
            childChkBoxes[i].checked = check;
        }
    }

    function CheckUncheckParents(srcChild, check) {
        var parentDiv = GetParentByTagName("div", srcChild);
        var parentNodeTable = parentDiv.previousSibling;

        if (parentNodeTable) {
            var checkUncheckSwitch;

            if (check) //checkbox checked
            {
                var isAllSiblingsChecked = AreAllSiblingsChecked(srcChild);
                if (isAllSiblingsChecked)
                    checkUncheckSwitch = true;
                else
                    return; //do not need to check parent if any(one or more) child not checked
            }
            else //checkbox unchecked
            {
                checkUncheckSwitch = false;
            }

            var inpElemsInParentTable = parentNodeTable.getElementsByTagName("input");
            if (inpElemsInParentTable.length > 0) {
                var parentNodeChkBox = inpElemsInParentTable[0];
                parentNodeChkBox.checked = checkUncheckSwitch;
                //do the same recursively
                CheckUncheckParents(parentNodeChkBox, checkUncheckSwitch);
            }
        }
    }

    function AreAllSiblingsChecked(chkBox) {
        var parentDiv = GetParentByTagName("div", chkBox);
        var childCount = parentDiv.childNodes.length;
        for (var i = 0; i < childCount; i++) {
            if (parentDiv.childNodes[i].nodeType == 1) //check if the child node is an element node
            {
                if (parentDiv.childNodes[i].tagName.toLowerCase() == "table") {
                    var prevChkBox = parentDiv.childNodes[i].getElementsByTagName("input")[0];
                    //if any of sibling nodes are not checked, return false
                    if (!prevChkBox.checked) {
                        return false;
                    }
                }
            }
        }
        return true;
    }

    //utility function to get the container of an element by tagname
    function GetParentByTagName(parentTagName, childElementObj) {
        var parent = childElementObj.parentNode;
        while (parent.tagName.toLowerCase() != parentTagName.toLowerCase()) {
            parent = parent.parentNode;
        }
        return parent;
    }

</script>

它成功了……

【讨论】：