zoukankan
html css js c++ java
asp.net2.0下利用javascript实现treeview中的checkbox全选
实现了对Treeview控件中选择框CheckBox的全选处理。实现的是菜单选择框父项打勾后它下面的子项选择框全部为打勾。如果其中一项子 项取消打勾父项父项选择框为空。主要效果见下图:
主要的实现原理是在TreeView控件的
onclick
事件中用JS实现全选操作。
<
script language
=
"
javascript
"
type
=
"
text/javascript
"
>
function OnTreeNodeChecked()
{
var ele
=
event
.srcElement;
if
(ele.type
==
'
checkbox
'
)
{
var childrenDivID
=
ele.id.replace(
'
CheckBox
'
,
'
Nodes
'
);
var div
=
document.getElementById(childrenDivID);
if
(div
!=
null
)
{
var checkBoxs
=
div.getElementsByTagName(
'
INPUT
'
);
for
(var i
=
0
;i
<
checkBoxs.length;i
++
)
{
if
(checkBoxs[i].type
==
'
checkbox
'
)
checkBoxs[i].
checked
=
ele.
checked
;
}
}
else
{
var div
=
GetParentByTagName(ele,
'
DIV
'
);
var checkBoxs
=
div.getElementsByTagName(
'
INPUT
'
);
var parentCheckBoxID
=
div.id.replace(
'
Nodes
'
,
'
CheckBox
'
);
var parentCheckBox
=
document.getElementById(parentCheckBoxID);
for
(var i
=
0
;i
<
checkBoxs.length;i
++
)
{
if
(checkBoxs[i].type
==
'
checkbox
'
&&
checkBoxs[i].
checked
)
{
parentCheckBox.
checked
=
true
;
return
;
}
}
parentCheckBox.
checked
=
false
;
}
}
}
function GetParentByTagName(element, tagName)
{
var parent
=
element.parentNode;
var upperTagName
=
tagName.toUpperCase();
while
(parent
&&
(parent.tagName.toUpperCase()
!=
upperTagName))
{
parent
=
parent.parentNode
?
parent.parentNode : parent.parentElement;
}
return
parent;
}
</
script
>
剩下的就是
TreeView
控件绑定的
onclick
事件了。
<
asp:TreeView ID
=
"
TreeView1
"
runat
=
"
server
"
onclick
=
"
OnTreeNodeChecked()
"
ShowCheckBoxes
=
"
All
"
ExpandDepth
=
"
2
"
Width
=
"
100%
"
Height
=
"
100%
"
>
</
asp:TreeView
>
至此实现了所有的用JS实现TreeView控件的全选与部分选择的问题。
查看全文
相关阅读:
电商拼团系统开发思路和拼团系统开发产品设计思路
唐古拉优选拼团系统设计模式和唐古拉优选拼团系统核心代码介绍
计算机体系结构之三--函数的调用和返回【译】
cxv文件合并
ubuntu18.04安装Mono及MonoDevelop,用c#开发winform
repo怎么都下不完,原因
repo下载安卓源码经常掉线,解决方法
编译ad10
ub18.04 root账户
安卓源码导入android studio
原文地址:https://www.cnblogs.com/huangwen/p/718573.html
最新文章
git清除凭证
mapbox的expressions应用
pgsql2shp和postsql命令行乱码
POSTGIS增删改查 点、线、面表
PostgreSQL 配置 pg_hba.conf 允许远程访问
git相关问题
ECharts常用配置
#!/usr/bin/env node
ES6数组去重
ES6
热门文章
element 时间插件在移动端,阻止键盘弹出
css常用标签
html第一天
树莓派4b 安装 ubuntu MATE 20.04.2 LTS 搭建个人服务器(2) 配置wifi
树莓派4b 安装 ubuntu MATE 20.04.2 LTS 搭建个人服务器(1) 安装系统并且配置ssh远程登录
移动端布局缩放
A*寻路算法,通过选取节点的优化减少节点访问数量
王德峰-马克思主义哲学选段课堂笔记-感性活动与理性的关系。
PHP程序开发过程中的性能优化随笔
PHP运用Redis实现高并发应用于商城秒杀功能实例
Copyright © 2011-2022 走看看