实现当TreeView中父节点的CheckBox的点选状态改变时
回发服务器端
触发TreeView1_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)事件
从而通过代码来控制子节点的CheckBox的点选状态 一同改变
主要步骤及代码示例如下：
1.TreeView绑定onclick事件
通过本事件 引发回发
2.在TreeView1_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)事件
编写相关代码 控制子节点的CheckBox点选状态
-------------------- HTML 页面部分 -----------------------
2<head runat="server">
3 <title>VS2005 TreeView CheckBox</title>
4 <script type="text/javascript">
5 // 点击复选框时触发事件
6 function postBackByObject()
7 {
8 var o = window.event.srcElement;
9 if (o.tagName == "INPUT" && o.type == "checkbox")
10 {
11 __doPostBack("","");
12 }
13 }
14</script>
15</head>
16<body>
17 <form id="form1" runat="server">
18 <div>
19 <asp:TreeView ID="TreeView1" runat="server" OnTreeNodeCheckChanged="TreeView1_TreeNodeCheckChanged">
20 <SelectedNodeStyle BackColor="SlateGray" />
21 </asp:TreeView>
22 </div>
23 </form>
24</body>
25</html>
--------------------- cs页面代码 --------------------
protected void Page_Load(object sender, EventArgs e)
2 {
3 if (!IsPostBack)
4 {
5 //构建TreeView
6 TreeNode Node00 = new TreeNode("00", "00");
7
8 TreeNode Node01 = new TreeNode("01", "01");
9 TreeNode Node0101 = new TreeNode("0101", "0101");
10 TreeNode Node0102 = new TreeNode("0102", "0102");
11 TreeNode Node02 = new TreeNode("02", "02");
12
13 Node01.ChildNodes.Add(Node0101);
14 Node01.ChildNodes.Add(Node0102);
15
16 Node00.ChildNodes.Add(Node01);
17 Node00.ChildNodes.Add(Node02);
18
19 TreeView1.Nodes.Add(Node00);
20
21 TreeView1.ShowCheckBoxes = TreeNodeTypes.All;//显示CheckBox
22
23 TreeView1.ExpandDepth = 0;
24
25 }
26 //绑定事件
27 TreeView1.Attributes.Add("onclick", "postBackByObject()");
28
29 }
30
31 //
32 protected void TreeView1_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e)
33 {
34 SetChildChecked(e.Node);
35 }
36
37 //
38 private void SetChildChecked(TreeNode parentNode)
39 {
40 foreach (TreeNode node in parentNode.ChildNodes)
41 {
42 node.Checked = parentNode.Checked;
43
44 if (node.ChildNodes.Count > 0)
45 {
46 SetChildChecked(node);
47 }
48 }
49 }
另一种CS 选中判断 根据父节点判断子节点选中、子节点全部取消判断父节点也取消。
#region 级联父子节点的复选框状态
/// <summary>
/// 节点选中状态更改
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void TreeNodeCheckChanged ( object sender, TreeNodeEventArgs e )
{
SetChildChecked ( e.Node );
// 判断是否是根节点
if ( !e.Node.Value.Equals ( "0" ) )
{
SetParentChecked ( e.Node );
}
}
/// <summary>
/// 根据父节点状态设置子节点的状态
/// </summary>
/// <param name="parentNode"></param>
private void SetChildChecked ( TreeNode parentNode )
{
foreach ( TreeNode node in parentNode.ChildNodes )
{
node.Checked = parentNode.Checked;
if ( node.ChildNodes.Count > 0 )
{
SetChildChecked ( node );
}
}
}
/// <summary>
/// 根据子节点状态设置父节点的状态
/// </summary>
/// <param name="childNode"></param>
private void SetParentChecked ( TreeNode childNode )
{
TreeNode parentNode = childNode.Parent;
if ( !parentNode.Checked && childNode.Checked )
{
parentNode.Checked=true;
}
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.Value.Equals ( "0" ) )
{
SetParentChecked ( parentNode );
}
}
}
}
#endregion
-----------------------------------------------------------------------------------------------------------------------------------
推荐这个方法：
添加完以后,当选择checkbox的时候将回发一次,接着就只要在后台的TreeNodeCheckChanged()里面判断一下
就可以达到全选的目的了.但是这个每次选择的时候,都要刷新页面.
为了不刷新 ,就在前台写代码控制:
<script type="text/javascript">
function getcheck()
{
var o = window.event.srcElement;
if (o.tagName == "INPUT" && o.type == "checkbox") //点击treeview的checkbox是触发
{
var d=o.id;//获得当前checkbox的id;
var e= d.replace("CheckBox","Nodes");//通过查看脚本信息,获得包含所有子节点div的id
var div= window.document.getElementById(e);//获得div对象
if(div!=null) //如果不为空则表示,存在子节点
{
var check=div.getElementsByTagName("INPUT");//获得div中所有的已input开始的标记
for(i=0;i<check.length;i++)
{
if(check[i].type=="checkbox") //如果是checkbox
{
check[i].checked=o.checked;//字节点的状态和父节点的状态相同,即达到全选
}
}
}
//else //点子节点的时候,使父节点的状态改变,即不为全选
//{
//处理父节点
var divid=o.parentElement.parentElement.parentElement.parentElement.parentElement; //子节点所在的div
while (divid!=null)
{
var id= divid.id.replace("Nodes","CheckBox"); //获得根节点的id
var checkbox=divid.getElementsByTagName("INPUT"); //获取所有子节点数
var s=0;
for(i=0;i<checkbox.length;i++)
{
if(checkbox[i].checked) //判断有多少子节点被选中
{
s++;
}
}
if(s==checkbox.length) //如果全部选中 或者 选择的是另外一个根节点的子节点 ，
{ // 则开始的根节点的状态仍然为选中状态
window.document.getElementById(id).checked=true;
}
else
{ //否则为没选中状态
window.document.getElementById(id).checked=false;
}
divid=window.document.getElementById(id).parentElement.parentElement.parentElement.parentElement.parentElement;
}
}
}
</script>
后台代码用：tv1.Attributes.Add("onclick", "getcheck()");