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控件的全选与部分选择的问题。
查看全文
相关阅读:
SSIS-SqlTask控件使用
每年有20万人进军IT行业,为何人才缺口依旧这么大?
推荐!5 本经典著作描绘C++学习路线图!
C语言有了"链表"还用"数组"干嘛?因为你傻呀,怕你学不会!
如何优化【if else】的面条代码,我们一起来解决代码复杂度问题!
为什么要学编程一定要热爱?对不起我并不热爱编程,我只喜欢创造!
程序员如何应对双十一的大数据冲击!是服务器先崩溃还是程序员先崩溃?
【C语言项目】这21个入门练手项目,让你对C语言不再说难!
【学习编程】有0.5倍速和2倍速的学习方法,那你看到过10倍速的学习技巧吗!
外包程序员入职蚂蚁金服被质疑,网友评论人生污点,真就不拿外包当人了呗?
原文地址:https://www.cnblogs.com/huangwen/p/718573.html
最新文章
ACM比赛_注意
CodeForces 获得数据
codeblocks调试
编程注意1
螺旋队列和hiho1525逃离迷宫3
编写程序之调试
兰州大学数据结构实验课 程序
Vue数组常用操作
CSS3 transition 属性
使用 calc() 函数计算 <div> 元素的宽度:
热门文章
加锁问题
C++ 之获取map元素[转]
WaitForSingleObject的作用[转]
waitforsingleobject
C++的命名空间
错误描述:fatal error C1010: 在查找预编译头时遇到意外的文件结尾。是否忘记了向源中添加“#include "stdafx.h"”?(转)
删除文件时,提示文件已在另一个程序中打开而导致文件无法删除,怎么办(转)
0xC0000005: 写入位置 0x00000000 时发生访问冲突的解决办法(转)
windows系统下MySQL中遇到1045问题
svn解决方案
Copyright © 2011-2022 走看看