经典实例－－客户端操作带CheckBox的TreeView

经典实例－－客户端操作带CheckBox的TreeView（1）－－选择 /取消父节点后其所有子节点自动选择 /取消。不过里面有点小问题要注意:

(1)就是如何初始化已经选择的节点:注意要从客户端初始化的(把选择的节点放在客户端一个隐藏域里通过JS初始化).如果你在服务器端初始化了将无法在客户端修改它的状态.

(2)如何获得客户端设置的节点:在客户端改变了选择状态(node.setAtrribute("check","ture"))后,通过服务器端是无法获得选择的值的,也只能在客户端获得它(通过一个input type="hiiden" runat="server"来保存选择的值).

详细代码：
<script language="javascript">

            //初始化选中节点
            function initchecknode()
            {
                //获得需要初始化选择状态的节点的字符串.
                var selectedNodes = document.all.checkedNodes.value;
                var arrayNodes = new Array();
                arrayNodes = selectedNodes.split(",");
                var AllRootNode=new Array();
                AllRootNode=document.getElementById("TreeView1").getChildren();
                //初始化选择的节点
                findAndCheckedNodes(AllRootNode,arrayNodes);
            }

            //根据已选择的节点的字符串初始化选择的节点
            function findAndCheckedNodes(NodeArray,nodeDatas)
            {
                //alert(NodeArray.length);
                 if(parseInt(NodeArray.length)==0)
                 {
                    return;
                }
                else
                {
                    for(var i=0;i<parseInt(NodeArray.length);i++)
                    {
                        var cNode,nodeData;
                        cNode=NodeArray[i];
                        ////如果该节点在nodeDatas里则初始化checked = true;
                        nodeData = cNode.getAttribute("NodeData");
                        for(var j=0;j<nodeDatas.length;j++)
                        {
                            if(nodeDatas[j] == nodeData)
                            {
                                cNode.setAttribute("checked","true");
                                break;
                            }
                        }
                        //如果有子节点,则继续递归
                        if(parseInt(cNode.getChildren().length)!=0)
                        findAndCheckedNodes(cNode.getChildren(),nodeDatas);    
                    }
                }
            }
            
            //节点的oncheck事件
            function tree_oncheck(tree)
            {
                var node=tree.getTreeNode(tree.clickedNodeIndex);
                var Pchecked=tree.getTreeNode(tree.clickedNodeIndex).getAttribute("checked");
                setcheck(node,Pchecked);
                document.all.checkedNodes.value="";
                document.all.unchecked.value="";
                FindCheckedFromNode(TreeView1);
            }
            //设置子节点选中
            function setcheck(node,Pc)
            {
                var i;
                var ChildNode=new Array();
                ChildNode=node.getChildren();
                 
                if(parseInt(ChildNode.length)==0)
                    return;
                else
                {
                    for(i=0;i<ChildNode.length;i++)
                    {
                        var cNode;
                        cNode=ChildNode[i];
                        if(parseInt(cNode.getChildren().length)!=0)
                            setcheck(cNode,Pc);
                        cNode.setAttribute("checked",Pc);
                    }
                }
            }
            //获取所有节点状态
            function FindCheckedFromNode(node) 
            {
                var i = 0;
                var nodes = new Array();
                nodes = node.getChildren();
                 
                for (i = 0; i < nodes.length; i++) 
                {
                    var cNode;
                    cNode=nodes[i];
                    if (cNode.getAttribute("checked"))
                        AddChecked(cNode);
                    else
                        AddUnChecked(cNode);
                      
                    if (parseInt(cNode.getChildren().length) != 0 ) 
                    {
                        FindCheckedFromNode(cNode);
                    }
                }
            }
            //添加选中节点
            function AddChecked(node) 
            {
                document.all.checkedNodes.value += node.getAttribute("NodeData");
                document.all.checkedNodes.value += ',';
            }
            //添加未选中节点
            function AddUnChecked(node)
            {
                document.all.unchecked.value += node.getAttribute("NodeData");
                document.all.unchecked.value += ',';
            }
            
        </script>

 

    <body MS_POSITIONING="FlowLayout" onload="initchecknode()">
        <form id="Form1" method="post" runat="server">
            <FONT face="宋体">
                <TABLE class="main" id="Table1">
                    <TR>
                        <TD></TD>
                        <TD align="center" height="50">权限管理</TD>
                        <TD></TD>
                    </TR>
                    <TR>
                        <TD></TD>
                        <TD>用户名:
                            <asp:label id="lblUserName" runat="server">Label</asp:label></TD>
                        <TD></TD>
                    </TR>
                    <TR>
                        <TD></TD>
                        <TD><iewc:treeview id="TreeView1" runat="server" ExpandLevel="1" SelectExpands="True" SystemImagesPath="/webctrl_client/1_0/treeimages/"
                                ImageUrl="images/fclose.gif" SelectedImageUrl="images/bookmark.gif" ExpandedImageUrl="images/fopen.gif"
                                Target="main" AutoSelect="True" wilth="100%"></iewc:treeview></TD>
                        <TD></TD>
                    </TR>
                    <TR>
                        <TD></TD>
                        <TD align="center" height="50">
                            <asp:button id="BtnSure" runat="server" Text="保存"></asp:button>&nbsp;
                        </TD>
                        <TD></TD>
                    </TR>
                </TABLE>
            <INPUT id="checkedNodes" type="hidden" size="32" runat="server" NAME="checkedNodes"> <!--已经选择的节点每个节点间用","分隔.-->
            <INPUT id="unchecked" type="hidden" size="32">
        </form>
    </body>

主要后台代码:

        
//数据访问实例
protected ClassConn connE = new ClassConn();

private void Page_Load(object sender, System.EventArgs e)
{
    // 在此处放置用户代码以初始化页面
    if ( !IsPostBack)
    {
        TreeView1.Attributes.Add("oncheck","tree_oncheck(this)");
        ViewState["UserId"] = Request.QueryString["id"]+string.Empty;

        //初始化用户名
        lblUserName.Text=connE.GetFieldValue("string","select name from EPM_EmployeeList where id = "+ViewState["UserId"].ToString());
        ViewState["dsTree"] = connE.getDs("select * from EPM_DepartmentList where corpid="+Session["EnterpriseId"].ToString()+" and (type ="+Session["EnterpriseType"].ToString()+" or type=2)  and state=1 order by ShowIndex");
        connE.Close();
        //初始化权限信息    
        InitData();


        
    }
}


/**//// <summary>
/// 初始化权限树.
/// </summary>
/// <param name="nFatherid">父节点的ID</param>
/// <param name="node"></param>
protected void initTree( int nFatherid,TreeNode fatherNode)
{
    DataSet ds = (DataSet)ViewState["dsTree"];
    DataView dv = new DataView(ds.Tables[0]);
    dv.RowFilter = "[parentDeptid] = "+nFatherid;
    
    foreach ( DataRowView Row in dv )
    {
        TreeNode node = new TreeNode();
        if (fatherNode == null)//根节点
        {
            node.Text=Row["name"].ToString();
            node.NodeData = Row["id"].ToString();
            node.CheckBox = true;
            this.TreeView1.Nodes.Add(node);
            //node.Expanded=false;//是否展开,若设置为true 则ExpandLevel="1" 无效
            initTree(Int32.Parse(Row["id"].ToString()),node);//递归
        }
        else
        {
            node.Text = Row["name"].ToString();
            node.NodeData = Row["id"].ToString();
            //node.NavigateUrl = Row["url"].ToString();
            node.CheckBox = true;
            fatherNode.Nodes.Add(node);
            initTree(Int32.Parse(Row["id"].ToString()),node);//递归
        }
    }

}

/**//// <summary>
/// 设置权限的字符串,没个权限间用逗号分隔.
/// </summary>
/// <returns></returns>
private string  InitPowers()
{
    string strPowers = string.Empty;
    string strSql = "select id, DeptID from  EPM_PowerList where EMPid ="+ViewState["UserId"].ToString();
    SqlDataReader reader = connE.getDreader(strSql);
    while(reader.Read())
    {
        if (strPowers.Length == 0)
        {
            strPowers = reader[1].ToString();
        }
        else
        {
            strPowers += ","+reader[1].ToString();
        }
    }
    reader.Close();
    return strPowers;
}

/**//// <summary>
/// 初始化权限树
/// </summary>
private void InitData()
{
    //获得权限字符串
    string strPowers = InitPowers();
    //把权限字符串赋给checkedNodes.
    this.checkedNodes.Value = strPowers;
    //初始化菜单树,使用递归调用.
    this.TreeView1.Nodes.Clear();
    initTree(0,(TreeNode)null);
}



/**//// <summary>
/// 保存权限的设置
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void BtnSure_Click(object sender, System.EventArgs e)
{
    //先删除原来权限的设置
    string strSql = "delete from EPM_PowerList where empid="+ViewState["UserId"].ToString();
    connE.runSqlOnly(strSql);
    //重新设置权限
    SaveTree();
    connE.Alert("保存成功!",Page);

    //重新在服务器端初始权限信息
    InitData();
    
}

/**//// <summary>
/// 保存树中已选择的节点
/// </summary>

protected void SaveTree()
{
    //获得所有已经选择的接点
    string strSelected = string.Empty;
    strSelected = this.checkedNodes.Value;
    if(strSelected != string.Empty)
    {
        strSelected = strSelected.Substring(0,strSelected.Length-1);
        string [] strSelecteds  = strSelected.Split(',');
        foreach(string str in strSelecteds)
        {
            string strSql = "insert EPM_PowerList (EMPid,deptid) values ('"+ViewState["UserId"].ToString()+"','"+str+"')";
            connE.runSqlOnly(strSql);
        }
    }
    
}