Asp.Net TreeView实现父子节点联动效果

一、在前台页面嵌入JS脚本实现父子节点联动效果：

<script>

function setParentState(objNode)
        {
            var objParentDiv = WebForm_GetParentByTagName(objNode,"div");
            if(objParentDiv == null || objParentDiv == "undefined")
            return;
            var divID = objParentDiv.getAttribute("ID");
            var prefix = divID.substring(0,divID.indexOf("Nodes"));
            var parentID = prefix + "CheckBox";  
            var parentChk = document.getElementById(parentID);
            if(parentChk == null || parentChk == "undefined")
                return;
            if (objNode.checked)
            {
                parentChk.checked = true;
            }
            else
            {
                if (isAllChildrenUnChecked(parentChk))
                {
                    parentChk.checked = false;
                }
            }
            setParentState(parentChk);
        }
       
        function setChildState(objNode)
        {
            var nodeID = objNode.getAttribute("ID");
            var prefix = nodeID.substring(0,nodeID.indexOf("CheckBox"));
            var childrenDiv = document.getElementById(prefix + "Nodes");
            if(childrenDiv == null || childrenDiv == "undefined")
                return;
            var childrenArray = childrenDiv.children;
            for(var i = 0;i< childrenArray.length;i++)
            {
                var container = childrenArray[i];
                var chk = WebForm_GetElementByTagName(container,"input");
                chk.checked = objNode.checked;
                setChildState(chk);
            }
        }
       
        function isAllChildrenUnChecked(objChk)
        {
            var objChkID = objChk.getAttribute("ID");
            var prefix = objChkID.substring(0,objChkID.indexOf("CheckBox"));
            var childrenDiv = document.getElementById(prefix + "Nodes");
            if(childrenDiv == null || childrenDiv == "undefined")
                return;
            var childrenArray = childrenDiv.children;
            for(var i = 0;i< childrenArray.length;i++)
            {
                var container = childrenArray[i];
                var chk = WebForm_GetElementByTagName(container,"input");
                if (chk.checked)
                    return false;
            }
            return false;
        }
       
        function HandleCheckEvent()
        {
            var objNode = event.srcElement;
            if(objNode.tagName !="INPUT" || objNode.type!="checkbox")
                return;
            setChildState(objNode);
            setParentState(objNode);
        }

</script>

　　最后记得要在后台的加载事件中添加：deptTreeView.Attributes.Add("onclick", "HandleCheckEvent()");

 

 

二、在后台实现父子节点联动效果：

　　在TreeView的SelectNodeChangeed事件中加入以下代码：

        protected void deptTreeView_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)
        {
            SetChildChecked(e.Node);
            if (e.Node.Parent!=null)
            {
                SetParentChecked(e.Node);
            }
        }

        private void SetChildChecked(TreeNode parentNode)
        {
            foreach (TreeNode node in parentNode.ChildNodes)
            {
                node.Checked = parentNode.Checked;
                if (node.ChildNodes.Count>0)
                {
                    SetChildChecked(node);
                }
            }
        }

        private void SetParentChecked(TreeNode childNode)
        {
            if (childNode.Parent!=null)
            {
                TreeNode parentNode = childNode.Parent;
                if (!parentNode.Checked&&childNode.Checked)
                {
                    parentNode.Checked = true;
                    if (parentNode.Parent!=null)
                    {
                        SetParentChecked(parentNode);
                    }
                }
                else if (parentNode.Checked&&!childNode.Checked)
                {
                    int checks = 0;
                    foreach (TreeNode node in parentNode.ChildNodes)
                    {
                        if (node.Checked)
                        {
                            checks++;
                            break;
                        }
                    }
                    if (checks==0)
                    {
                        parentNode.Checked = false;
                        if (parentNode.Parent!=null)
                        {
                            SetParentChecked(parentNode);
                        }
                    }
                }
            }
        }

　　最后在TreeView前台控件中确实是否添加了ontreenodecheckchanged="deptTreeView_TreeNodeCheckChanged"，如果没有请手动添加上！