ASP.NET 2.0 TreeView中用JavaScript实现单选功能.
2007-10-11 09:44
681 查看
我的免费电影网站一:http://www.foxwow.com
我的免费电影网站二:http://www.91free.org
由于项目要求需要实现,TreeView中CheckBox的单选功能,本人在网络上找了半天.没有找到满意的.于是自己研究了下,实现了这个功能,现放于Blog中,一方面一备忘,另一方面提供给需要的朋友. 有什么问题请提出.
//
用Treeview chekbox节点单选的处理事件
function
TreeSingleSelect(treeID,checkNode)
{
if
(
!
treeID)
return
;
var
objs
=
document.getElementsByTagName(
"
input
"
);
for
(
var
i
=
0
;i
<
objs.length;i
++
)
{
if
(objs[i].type
==
'
checkbox
'
)
{
var
obj
=
objs[i];
if
(obj.id.indexOf(treeID)
!=-
1
)
{
if
(obj
!=
checkNode)
{
obj.checked
=
false
;
}
}
}
}
}
//
用于给TreeView的 chebox添加 单击事件(如果要将某一TreeView变为单选择 只需调用下面方法)
function
SetTreeNodeClickHander(treeID)
{
var
objs
=
document.getElementsByTagName(
"
input
"
);
for
(
var
i
=
0
;i
<
objs.length;i
++
)
{
if
(objs[i].type
==
'
checkbox
'
)
{
var
obj
=
objs[i];
if
(obj.id.indexOf(treeID)
!=-
1
)
{
objs[i].onclick
=
function
(){TreeSingleSelect(treeID,
this
);};
}
}
}
}
上面是主要的两个方法实现
TreeSingleSelect方法是,选择TreeView的CheckBox的事件.
SetTreeNodeClickHander这个方法是把TreeSingleSelect方法注册到TreeView的所有CheckBox上。
注册代码如下:
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
<
div style
=
"
width:500px; height:450px; overflow:auto
"
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
<
asp:TreeView runat
=
"
server
"
ID
=
"
tvAssetKindTree
"
ExpandDepth
=
"
0
"
ShowCheckBoxes
=
"
All
"
ShowLines
=
"
True
"
ExpandImageToolTip
=
""
></
asp:TreeView
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
</
div
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
<
script type
=
"
text/javascript
"
language
=
"
javascript
"
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
SetTreeNodeClickHander(
"
tvAssetKindTree
"
);
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
</
script
>
SetTreeNodeClickHander方法的参数是TreeView的客户端ID,一般情况下和服务端ID想同,在有控件嵌套(如用户控件或者MasterPage中)TreeView.ClientID来,当然任何情况下都可以用后一种方法来实现.代码如下:
<
div style
=
"
width:500px; height:450px; overflow:auto
"
>
<
asp:TreeView runat
=
"
server
"
ID
=
"
tvAssetKindTree
"
ExpandDepth
=
"
0
"
ShowCheckBoxes
=
"
All
"
ShowLines
=
"
True
"
ExpandImageToolTip
=
""
></
asp:TreeView
>
</
div
>
<
script type
=
"
text/javascript
"
language
=
"
javascript
"
>
SetTreeNodeClickHander(
"
<%=tvAssetKindTree.ClientID%>
"
);
</
script
>
我的免费电影网站二:http://www.91free.org
由于项目要求需要实现,TreeView中CheckBox的单选功能,本人在网络上找了半天.没有找到满意的.于是自己研究了下,实现了这个功能,现放于Blog中,一方面一备忘,另一方面提供给需要的朋友. 有什么问题请提出.
//
用Treeview chekbox节点单选的处理事件
function
TreeSingleSelect(treeID,checkNode)
{
if
(
!
treeID)
return
;
var
objs
=
document.getElementsByTagName(
"
input
"
);
for
(
var
i
=
0
;i
<
objs.length;i
++
)
{
if
(objs[i].type
==
'
checkbox
'
)
{
var
obj
=
objs[i];
if
(obj.id.indexOf(treeID)
!=-
1
)
{
if
(obj
!=
checkNode)
{
obj.checked
=
false
;
}
}
}
}
}
//
用于给TreeView的 chebox添加 单击事件(如果要将某一TreeView变为单选择 只需调用下面方法)
function
SetTreeNodeClickHander(treeID)
{
var
objs
=
document.getElementsByTagName(
"
input
"
);
for
(
var
i
=
0
;i
<
objs.length;i
++
)
{
if
(objs[i].type
==
'
checkbox
'
)
{
var
obj
=
objs[i];
if
(obj.id.indexOf(treeID)
!=-
1
)
{
objs[i].onclick
=
function
(){TreeSingleSelect(treeID,
this
);};
}
}
}
}
上面是主要的两个方法实现
TreeSingleSelect方法是,选择TreeView的CheckBox的事件.
SetTreeNodeClickHander这个方法是把TreeSingleSelect方法注册到TreeView的所有CheckBox上。
注册代码如下:
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
<
div style
=
"
width:500px; height:450px; overflow:auto
"
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
<
asp:TreeView runat
=
"
server
"
ID
=
"
tvAssetKindTree
"
ExpandDepth
=
"
0
"
ShowCheckBoxes
=
"
All
"
ShowLines
=
"
True
"
ExpandImageToolTip
=
""
></
asp:TreeView
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
</
div
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
<
script type
=
"
text/javascript
"
language
=
"
javascript
"
>
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
SetTreeNodeClickHander(
"
tvAssetKindTree
"
);
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
</
script
>
SetTreeNodeClickHander方法的参数是TreeView的客户端ID,一般情况下和服务端ID想同,在有控件嵌套(如用户控件或者MasterPage中)TreeView.ClientID来,当然任何情况下都可以用后一种方法来实现.代码如下:
<
div style
=
"
width:500px; height:450px; overflow:auto
"
>
<
asp:TreeView runat
=
"
server
"
ID
=
"
tvAssetKindTree
"
ExpandDepth
=
"
0
"
ShowCheckBoxes
=
"
All
"
ShowLines
=
"
True
"
ExpandImageToolTip
=
""
></
asp:TreeView
>
</
div
>
<
script type
=
"
text/javascript
"
language
=
"
javascript
"
>
SetTreeNodeClickHander(
"
<%=tvAssetKindTree.ClientID%>
"
);
</
script
>
相关文章推荐
- ASP.NET 2.0 TreeView中用JavaScript实现选择子接点CheckBox是自动选择上父节点(或者所有父节点)
- ASP.NET TreeView 用JS实现节点的单选功能
- 用jQuery实现asp.net 2.0 treeview控件完全无刷新操作实例(AJAX的增、删、改、选择以及展开收缩节点)
- ASP.NET 2.0 Treeview Checkboxes - Check All - Javascript
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(六) 之 Layim源码改造右键菜单--好友、组管理功能的实现。
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载续][重点推荐控件]
- Asp.net 2.0 C#实现压缩/解压功能 (示例代码下载)
- asp.net中实现CheckBoxList单选功能
- 12.5 Ajax实现RSS频道的显示功能 (征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- Asp.net 2.0 C#实现压缩/解压功能 [转=向作者‘肖相’无私共享精神致敬]
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- 转载:Asp.net 2.0 C#实现压缩/解压功能 (示例代码下载)
- htc 的应用--htc解释:运用css+javascript方便的实现一些控件的特效+结合asp.net 2.0的应用
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- 在ASP.NET 2.0 下如何实现DataList的编辑功能