ASP.NET 2.0 TreeView中用JavaScript实现单选功能.

我的免费电影网站一：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上。

注册代码如下:



<
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
"

);



</
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
>