TreeView控件的CheckBox级联选中或取消

时间:2022-05-15 23:46:42

背景:

在一个项目开发中遇到这样的要求:当选中树中一个节点时,需要同时选中其父节点,直至根节点。在取消一个节点的选中时,需要将其所有子节点取消选中,直至叶子节点。由于项目用户体验暂时可以不用考虑,直接想到用TreeView的TreeNodeCheckChanged事件,但是运行时发现一个问题,当改变一个节点的CheckBox的选中状态时,不会触发TreeNodeCheckChanged事件,只有在点击了某一个节点的文本后在触发一系列的事件。因此这条路行不通了,只好另寻其它方法了。

实现方法:

直接使用事件的方法不可行,那直接想到的方法是通过脚本实现,结合网络资源和业务要求整理了如下js脚本。

         function postBackByObject() {
var element = window.event.srcElement;
if (element.tagName == "INPUT" && element.type == "checkbox") {
var checkedState = element.checked;
if (checkedState) {
while (element.tagName != "TABLE")
element = element.parentElement;
CheckWithParent(element);
}
else {
while (element.tagName != "TABLE")
element = element.parentElement;
UnCheckWithChilds(element);
}
}
}
//取消节点及其子节点(直至叶子节点)的选中状态。
function UnCheckWithChilds(table) {
if (table != null) {
Check(table, false);
var childDiv = table.nextSibling;
if (childDiv != null) {
if (childDiv.tagName == "DIV") {
var childs = childDiv.getElementsByTagName("table");
for (var i = 0; i < childs.length; i++) {
UnCheckWithChilds(childs[i]);
}
}
}
}
}
//选中节点及其父节点(直至根节点)。
//注:TreeView1 为TreeView控件的ID。
function CheckWithParent(table) {
if (table != null) {
Check(table, true);
var parentDiv = table.parentElement;
if (parentDiv.id == "TreeView1") {
return;
}
else {
var parentTable = parentDiv.previousSibling;
CheckWithParent(parentTable);
}
}
}
//修改节点的CheckBox状态。
function Check(table, checked) {
if (table != null) {
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;
}
}

TreeView控件的CheckBox级联选中或取消的更多相关文章

  1. TreeView控件的展开与折叠

    在窗体中添加一个TreeView控件,设置CheckBox属性为True,绑定数据 Archive jkj = new Archive();//自定义类        public void Bind ...

  2. WinForm开发中针对TreeView控件改变当前选择节点的字体与颜色

    本文转载:http://www.cnblogs.com/umplatform/archive/2012/08/29/2660240.html 在B/S开发中,对TreeView控件要改变当前选中节点的 ...

  3. 给C&num;的treeview控件的部分节点添加checkbox

    一.先初始化treeview this.treeView1.CheckBoxes = true; this.treeView1.ShowLines = false; this.treeView1.Dr ...

  4. 在TreeView 控件上,如果双击任何一个节点的checkbox 只会收到一次After&lowbar;Check事件 但是check属性变化两次(从false到true 再从true到false&rpar;,请问该如何解决,谢谢!

    在TreeView 控件上,如果双击任何一个节点的checkbox 只会收到一次After_Check事件 但是check属性变化两次(从false到true 再从true到false),请问该如何解 ...

  5. asp TreeView控件的使用

    相对于之前发过一个TreeView控件的使用方法 本次利用js操作,页面无刷新,性能提高 Css编码可能时我的模板页样式被继承下来,导致页面变乱,不需要的可以去掉 前台 <style> . ...

  6. WPF 将数据源绑定到TreeView控件出现界面卡死的情况

    首先来谈一下实现将自定义的类TreeMode绑定到TreeView控件上的一个基本的思路,由于每一个节点都要包含很多自定义的一些属性信息,因此我们需要将该类TreeMode进行封装,TreeView的 ...

  7. TreeView控件使用

    treeView1.SelectedNode = treeView1.Nodes[0];  //选中当前treeview控件的根节点为当前节点添加子节点:  TreeNode tmp; tmp = n ...

  8. 基于Treeview控件遍历本地磁盘

    一.前言 Treeview控件常用于遍历本地文件信息,通常与Datagridview与ImageList搭配.ImageList控件用于提供小图片给TreeView控件,DatagridView通常显 ...

  9. Android控件之CheckBox&lpar;复选框控件&rpar;

    一.有两种状态: 选中状态(true).未选中状态(false) 二.属性 android:id = "@+id/checkbox" android:layout_width=&q ...

随机推荐

  1. 吐血大奉献,打造cnblogs最新最火辣的css3模板(IE9以下请勿入内) -- 第一版

    一直自己都想给自己的博客打造一个独一无二的皮肤,但是一直没有强劲的动力去完成这件事情.后来凭借着工作上面的需求(涉及到css3),就把自己的博客当成一个最好的试验场地.从而产生了你现在所看到的这个模板 ...

  2. com&period;panie 项目开发随笔(NoF)&lowbar;环境搭建(2016&period;12&period;29)

    (一) 最近做的框架一直在 spring + springmvc + mybatis 的基础上,使用框架的好处自然是 简化了自己的开发工作,定义好大的结构体系后就在里面套用方法了! 可是框架的毛病同样 ...

  3. java比较两个对象是否相等的方法

    java比较两个对象是否相等直接使用equals方法进行判断肯定是不会相同的. 例如: Person  person1  =new Person("张三"); Person  pe ...

  4. Jfreechart初案例--饼图

    1.action @Controller(value = "pieAction") @Scope("prototype") public class PieAc ...

  5. css对齐

    2016-10-25 <css入门经典>第15章 1.text-align属性: 块属性内部的文本对齐方式.该属性只对块盒子有意义,内联盒子的内容没有对齐方式.(注意:只是盒子内部的内容对 ...

  6. ASP&period;NET MVC3 Model验证总结(转)

    推荐:   ASP.NET MVC的Model元数据与Model模板:预定义模板 http://www.cnblogs.com/artech/archive/2012/05/02/model-meta ...

  7. c&num; 数据绑定之 DataFormatString 格式

    数据绑定之DataFormatString 设定BoundField的DataFormatString,通常有以下几种 DataFormatString= "{0:C}" 货币,货 ...

  8. mongodb csv 文件导入数据库,删除特定字段

    1. 导入数据库 mongoimport -h host_ip -p port -d db_name -c collection_name --fields name1,name2,name3,nam ...

  9. Java 8 VM GC Tunning Guild Charter 9-b

    第九章 G1 GC The Garbage-First (G1) garbage collector is a server-style garbage collector, targeted for ...

  10. show processlist 输出ID 和 information&lowbar;schema&period;PROCESSLIST 的id&comma;information&lowbar;schema&period;innodb&lowbar;trx的TRX&lowbar;MYSQL&lowbar;T

    Session 1: mysql> start transaction; Query OK, 0 rows affected (0.00 sec) mysql> update Client ...