两个客户端操作TreeView节点CheckBox的小例子
第一个例子是当取消或选中节点选中状态时，子节点也做相应的取消或选中变化需要注意的是如果要初始设置TreeNode为选中状态，只能在客户端设置。如果在服务器端设置TreeNode为选中状态，则在客户端使用getAttribute("Checked")，得到的值永远是true。
<%@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls, Version=1.0.2.226, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<HTML> <HEAD> <script language="C#" runat="server">
private void Page_Load(object sender, System.EventArgs e)
{ 
TreeView1.Attributes.Add("oncheck","tree_oncheck(this)");
}
</script> <script language="javascript"><!--//初始化选中节点function initchecknode(){ var node=TreeView1.getTreeNode("1"); node.setAttribute("Checked","true"); setcheck(node,"true"); FindCheckedFromNode(TreeView1);}//oncheck事件function tree_oncheck(tree){ var node=tree.getTreeNode(tree.clickedNodeIndex); var Pchecked=tree.getTreeNode(tree.clickedNodeIndex).getAttribute("checked"); setcheck(node,Pchecked); document.all.checked.value=""; document.all.unchecked.value=""; FindCheckedFromNode(TreeView1);}//设置子节点选中function setcheck(node,Pc){ var i; var ChildNode=new Array(); ChildNode=node.getChildren(); if(parseInt(ChildNode.length)==0) return; else { for(i=0;i<ChildNode.length;i++) { var cNode; cNode=ChildNode[i]; if(parseInt(cNode.getChildren().length)!=0) setcheck(cNode,Pc); cNode.setAttribute("Checked",Pc); } }}//获取所有节点状态function FindCheckedFromNode(node) { var i = 0; var nodes = new Array(); nodes = node.getChildren(); for (i = 0; i < nodes.length; i++) { var cNode; cNode=nodes[i]; if (cNode.getAttribute("Checked")) AddChecked(cNode); else AddUnChecked(cNode); if (parseInt(cNode.getChildren().length) != 0 ) { FindCheckedFromNode(cNode); } }}//添加选中节点function AddChecked(node) { document.all.checked.value += node.getAttribute("NodeData"); document.all.checked.value += ',';}//添加未选中节点function AddUnChecked(node) { document.all.unchecked.value += node.getAttribute("NodeData"); document.all.unchecked.value += ',';}//--> </script> </HEAD> <body onload="initchecknode()"> <iewc:TreeView id="TreeView1" runat="server" ExpandLevel="5"> <iewc:TreeNode NodeData="0" CheckBox="True" Text="Node0" Expanded="True"> <iewc:TreeNode NodeData="1" CheckBox="True" Text="Node1" Expanded="True"></iewc:TreeNode> <iewc:TreeNode NodeData="2" CheckBox="True" Text="Node2" Expanded="True"> <iewc:TreeNode NodeData="3" CheckBox="True" Text="Node3" Expanded="True"> <iewc:TreeNode NodeData="4" CheckBox="True" Text="Node4" Expanded="True"></iewc:TreeNode> </iewc:TreeNode> </iewc:TreeNode> </iewc:TreeNode> <iewc:TreeNode NodeData="5" CheckBox="True" Text="Node5" Expanded="True"> <iewc:TreeNode NodeData="6" CheckBox="True" Text="Node6" Expanded="True"></iewc:TreeNode> </iewc:TreeNode> <iewc:TreeNode NodeData="7" CheckBox="True" Text="Node7" Expanded="True"> <iewc:TreeNode NodeData="8" CheckBox="True" Text="Node8" Expanded="True"> <iewc:TreeNode NodeData="9" CheckBox="True" Text="Node9" Expanded="True"></iewc:TreeNode> </iewc:TreeNode> </iewc:TreeNode> </iewc:TreeView><P> <TABLE id="Table1" cellSpacing="1" cellPadding="1" width="300" border="1"> <TR> <TD> <asp:Label id="Label1" runat="server">checked</asp:Label></TD> <TD> <INPUT id="checked" type="text" size="32"></TD> </TR> <TR> <TD> <asp:Label id="Label2" runat="server">unchecked</asp:Label></TD> <TD><INPUT id="unchecked" type="text" size="32"></TD> </TR> </TABLE> <br> </P> </body></HTML> 第二个例子是关于如何在服务器端得到客户端设置后的节点选中状态<%@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls, Version=1.0.2.226, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %><HTML> <HEAD> <script language="C#" runat="server"> private void Button1_Click(object sender, System.EventArgs e) { Response.Write(TreeView1.Nodes[0].Checked); } </script> <script language="javascript"> function set_check() { var nodeindex = "0"; var node=TreeView1.getTreeNode(nodeindex); node.setAttribute("Checked","True"); TreeView1.queueEvent('oncheck', nodeindex); } </script> </HEAD> <body> <form id="TestTree" method="post" runat="server"> <iewc:TreeView id="TreeView1" runat="server"> <iewc:TreeNode CheckBox="True" Text="Node0"></iewc:TreeNode> </iewc:TreeView> <br> <input type="button" value="set check" onclick="set_check()"> <br> <asp:Button id="Button1" runat="server" Text="submit" OnClick="Button1_Click"></asp:Button> </form> </body></HTML>posted on 2006-03-07 16:40 mjgforever 阅读(569) 评论(1) 编辑 收藏 举报
