treeView中CheckBox如何设置子节点Check属性

  Asp.net 2.0 中带有CheckBox的TreeView控件， 父节点CheckBox属性改了后如何修改其子节点的Check状态？

  有两种方法：
  一是PostBack回服务器端处理：
  这种方法，每次PostBack都会刷新页面，同时展开收缩节点也会PostBack回去，刷新页面，用户体验很是不好。
  首先在代码中注册属性：

1. this.TreeView1.Attributes.Add("onclick", "postBackByObject()");
   

  设置TreeView1的属性：

1.  OnTreeNodeCheckChanged="TreeNodeCheckChangeFunction"

   JavaScript脚本如下所示：

1. <script language="javascript">
2.   function postBackByObject()
3.   {
4.   var o = window.event.srcElement;
5.   if (element.tagName == "INPUT" && element.type == "checkbox")
6.   {
7.   __doPostBack("",""); 
8. }
9. }
10. </script>

然后在服务器段代码中对TreeView的Node子节点选中。
 

1. protected void TreeNodeCheckChangeFunction(object sender, TreeNodeEventArgs e)
2. {
3.   SetChildChecked(e.Node);
4. }
   

  第二种方法：注册javascript脚本事件，然后在客户端是JavaScript实现.用这种方法页面少了很多不必要Postback，减少服务器的负担。
  设置TreeView1的属性：
EnableClientScript="true"
  加入OnClick事件：

1. this.TreeView1.Attributes.Add("onclick", "postBackByObject()");
   

  JavaScript的脚本，如下：

1. <script language="javascript">
2.   function postBackByObject()
3.   {
4.   var element = window.event.srcElement;
5.   if (element.tagName == "INPUT" && element.type == "checkbox")
6.   {
7.   var checkedState = element.checked;
8.   while (element.tagName != "TABLE") 
9.   element = element.parentElement;
10.    
11.   UnCheck(element); 
12.   element = element.nextSibling;  
13.   if (element == null) 
14.   return;
15.    
16.   var childTables = element.getElementsByTagName("TABLE");
17.   for (var tableIndex = 0; tableIndex < childTables.length; tableIndex++)
18.   Check(childTables[tableIndex], checkedState);
19.   }
20.   }
22.   function UnCheck(table)
23.   {
24.   if (table == null || table.rows[0].cells.length == 2) // This is the root
25.   return;
26.   var parentTable = table.parentElement.previousSibling;
27.   Check(parentTable, false);
28.   UnCheck(parentTable);
29.   }
30.    
31.   function Check(table, checked)
32.   {
33.   var checkboxIndex = table.rows[0].cells.length - 1;
34.   var cell = table.rows[0].cells[checkboxIndex];
35.   var checkboxes = cell.getElementsByTagName("INPUT");
36.   if (checkboxes.length == 1)
37.   checkboxes[0].checked = checked;
38. }
39.   </script>

  同时最好给TreeNode的属性SelectAction 设置一下。

1. treeNode.SelectAction = TreeNodeSelectAction.None;

  这样，整个有CheckBox的TreeView控件，基本上就不会有什么和服务器交互的情况了，获得更好的用户体验