Delphi辅导:treeView中CheckBox如何设置子节点Check属性
来源:优易学  2011-6-7 12:35:22   【优易学:中国教育考试门户网】   资料下载   IT书店
 Asp.net 2.0 中带有CheckBox的TreeView控件, 父节点CheckBox属性改了后如何修改其子节点的Check状态?
  有两种方法:
  一是PostBack回服务器端处理:
  这种方法,每次PostBack都会刷新页面,同时展开收缩节点也会PostBack回去,刷新页面,用户体验很是不好。
  首先在代码中注册属性:
  this.TreeView1.Attributes.Add("onclick", "postBackByObject()");
  设置TreeView1的属性:
  OnTreeNodeCheckChanged="TreeNodeCheckChangeFunction"
  JavaScript脚本如下所示:
  <script language="javascript">
  function postBackByObject()
  {
  var o = window.event.srcElement;
  if (element.tagName == "INPUT" && element.type == "checkbox")
  {
  __doPostBack("","");
  }
  }
  </script>
  然后在服务器段代码中对TreeView的Node子节点选中。
  protected void TreeNodeCheckChangeFunction(object sender, TreeNodeEventArgs e)
  {
  SetChildChecked(e.Node);
  }
  第二种方法:注册javascript脚本事件,然后在客户端是JavaScript实现.用这种方法页面少了很多不必要Postback,减少服务器的负担。
  设置TreeView1的属性:
  EnableClientScript="true"
  加入OnClick事件:
  this.TreeView1.Attributes.Add("onclick", "postBackByObject()");
  JavaScript的脚本,如下:
  <script language="javascript">
  function postBackByObject()
  {
  var element = window.event.srcElement;
  if (element.tagName == "INPUT" && element.type == "checkbox")
  {
  var checkedState = element.checked;
  while (element.tagName != "TABLE")
  element = element.parentElement;
  UnCheck(element);
  element = element.nextSibling;
  if (element == null)
  return;
  var childTables = element.getElementsByTagName("TABLE");
  for (var tableIndex = 0; tableIndex < childTables.length; tableIndex++)
  Check(childTables[tableIndex], checkedState);
  }
  }
  function UnCheck(table)
  {
  if (table == null || table.rows[0].cells.length == 2) // This is the root
  return;
  var parentTable = table.parentElement.previousSibling;
  Check(parentTable, false);
  UnCheck(parentTable);
  }
  function Check(table, checked)
  {
  var checkboxIndex = table.rows[0].cells.length - 1;
  var cell = table.rows[0].cells[checkboxIndex];
  var checkboxes = cell.getElementsByTagName("INPUT");
  if (checkboxes.length == 1)
  checkboxes[0].checked = checked;
  }
  </script>
  同时最好给TreeNode的属性SelectAction 设置一下。
  treeNode.SelectAction = TreeNodeSelectAction.None;
  这样,整个有CheckBox的TreeView控件,基本上就不会有什么和服务器交互的情况了,获得更好的用户体验。

责任编辑:小草

文章搜索:
 相关文章
热点资讯
资讯快报
热门课程培训