<script runat=”server”>
protected void Page_Load(object sender, EventArgs e)
{
TreeView1.Attributes.Add(”onclick”, “OnClientTreeNodeChecked(event)”);
}
protected void Button1_Click(object sender, EventArgs e)
{
if (Request.Form["CheckedNode"] != null)
{
string CheckedNodeValue = Request.Form["CheckedNode"];
if (CheckedNodeValue == “”)
return;
if (CheckedNodeValue.EndsWith(”,”))
CheckedNodeValue = CheckedNodeValue.TrimEnd(’,');
Response.Write(”您选择的节点有:”+CheckedNodeValue);
}
}
</script>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head runat=”server”>
<title>客户端实现全选子节点</title>
<script type=”text/javascript” language=”javascript”>
//识别不同的浏览器
function getTargetElement(evt) {
var elem
if (evt.target)
{
elem = (evt.target.nodeType == 3) ? evt.target.parentNode : evt.target
}
else
{
elem = evt.srcElement
}
return elem
}
function OnClientTreeNodeChecked(evt)
{
evt = (evt) ? evt : ((window.event) ? window.event : “”)
if(evt == “”)
{
return
}
var obj = getTargetElement(evt)
var hasTreeNode = false
var treeNodeChecked
if (obj.tagName == “INPUT” && obj.type == “checkbox”) {
var treeNode = obj
treeNodeChecked = treeNode.checked
while (obj.tagName != “TABLE”)
{
obj = obj.parentNode
}
var parentTreeLevel = obj.rows[0].cells.length
var parentTreeNode = obj.rows[0].cells[0]
var containerDiv = obj.parentNode
if(containerDiv == null)
{
return
}
var tables = containerDiv.getElementsByTagName(”TABLE”)
var tableCount = tables.length
if(tableCount < 1)
{
return
}
for (i = 0; i < tableCount; i++)
{
if (tables[i] == obj)
{
hasTreeNode = true;
i++;
if (i == tableCount)
{
return;
}
}
if (hasTreeNode)
{
var childTreeLevel = tables[i].rows[0].cells.length;
if (childTreeLevel > parentTreeLevel)
{
var cell = tables[i].rows[0].cells[childTreeLevel - 1];
var inputs = cell.getElementsByTagName(”INPUT”);
inputs[0].checked = treeNodeChecked;
}
else
{
return;
}
}
}
}
}
function ShowCheckbox()
{
var TreeView = “<%=TreeView1.ClientID %>”
var checkNode = document.getElementById(”CheckedNode”)
var checkboxs = document.getElementById(TreeView).getElementsByTagName(”INPUT”)
for(i=0;i<checkboxs.length;i++)
{
if(checkboxs[i].type == “checkbox”
&& checkboxs[i].name.substr(0,TreeView.length) == TreeView
&& checkboxs[i].checked )
{
checkNode.value += checkboxs[i].title + “,”
}
}
}
</script>
</head>
<body>
<form id=”form1″ runat=”server”>
<asp:TreeView ID=”TreeView1″ runat=”server” ShowLines=”true”
ShowCheckBoxes=”All”>
<Nodes>
<asp:TreeNode Text=”【孟子E章】站点一” SelectAction=”SelectExpand”>
<asp:TreeNode Text=”ASP.NET技术”>
<asp:TreeNode Text=”缓存管理”/>
<asp:TreeNode Text=”状态管理” />
<asp:TreeNode Text=”导航控件”>
<asp:TreeNode Text=”Menu 服务器控件” />
<asp:TreeNode Text=”SiteMapPath 服务器控件” />
</asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text=”C#技术” />
</asp:TreeNode>
<asp:TreeNode Text=”【孟子E章】站点二” />
<asp:TreeNode Text=”【孟子E章】站点三”>
<asp:TreeNode Text=”Web开发技术” />
<asp:TreeNode Text=”Web脚本库” />
</asp:TreeNode>
</Nodes>
</asp:TreeView>
<input type=”hidden” name=”CheckedNode” id=”CheckedNode”/>
<asp:Button ID=”Button1″ runat=”server” OnClick=”Button1_Click”
OnClientClick=”ShowCheckbox()” Text=”提交” />
</form>
</body>
</html>
javascript實現treeview全選代碼
最新推荐文章于 2024-08-14 15:45:18 发布