首页 > 代码库 > 使用TreeView 使用多选功能
使用TreeView 使用多选功能
1.要用TreeView多选就要显示复选框，TreeView默认不显示复选框，显示复选框： TreeView2.ShowCheckBoxes = TreeNodeTypes.All;
初始化TreeView
for (int i = 0; i < 3; i++) { TreeNode node = new TreeNode("父节点" + i, i.ToString()); //node.SelectAction += TreeView1_TreeNodeCheckChanged; TreeView1.Nodes.Add(node); for (int j = 0; j < 4; j++) { TreeNode childNode = new TreeNode("子节点" + j, j.ToString()); node.ChildNodes.Add(childNode); if (j == 0) { childNode.ChildNodes.Add(new TreeNode("子节点" + 1, "1")); } } } TreeView1.ShowCheckBoxes = TreeNodeTypes.All;
效果：
2.显示了复选框之后，多选代码
//选中节点之后，选中节点的所有子节点 private void setChildNodeCheckedState(TreeNode currNode, bool state) { TreeNodeCollection nodes = currNode.ChildNodes; if (nodes.Count > 0) foreach (TreeNode tn in nodes) { tn.Checked = state; setChildNodeCheckedState(tn, state); } } //取消节点选中状态之后，取消所有父节点的选中状态 private void setParentNodeCheckedState(TreeNode currNode, bool state) { TreeNode parentNode = currNode.Parent; parentNode.Checked = state; if (currNode.Parent.Parent != null) { setParentNodeCheckedState(currNode.Parent, state); } } protected void TreeView1_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e) { if (e.Node.Checked) { //节点勾选之后，勾选所有的子节点 setChildNodeCheckedState(e.Node, true); if (e.Node.Parent != null)//检查同级的节点是否都勾选，都勾选了则勾选父节点 { bool allChildNodeChecked =true ; foreach (TreeNode node in e.Node.ChildNodes) { if (!node.Checked) { allChildNodeChecked = false; break; } } if (allChildNodeChecked) setParentNodeCheckedState(e.Node, true); } } else { //取消节点选中状态之后，取消所有父节点的选中状态 setChildNodeCheckedState(e.Node, false); //如果节点存在父节点，取消父节点的选中状态 if (e.Node.Parent != null) { setParentNodeCheckedState(e.Node, false); } } }
本来以为写了上面的代码点击复选框就可以勾选对应的子节点了，但是我错了。TreeView 只有点击节点上的文字才会触发TreeView1_TreeNodeCheckChanged事件，点击复选框没用，需要用到以下代码:
function postBackByObject() { __doPostBack("UpdatePanel1", ""); //此处前面是两个下划线(UpdatePanel1处是因为用了UpdatePanel所以才写这个控件ID的) } $(document).ready(function () {// $("input[type=‘checkbox‘]").bind("click", CheckSub);// $("input[type=‘checkbox‘]").bind("click", postBackByObject); $("[id^=‘MainContent_TreeView1‘][id$=‘CheckBox‘]").bind("click", postBackByObject); //所有id以MainContent_TreeView1开头，以CheckBox结尾的元素 });
至此大功告成！
网上也有用如下方法的，但是我发现此方法在点击节点前面的加减号的时候也会触发上面的代码，导致点击+/-号时有问题
protected void Page_Load(object sender, EventArgs e) { TreeView1.Attributes.Add("onclick", "postBackByObject()"); }protected void TreeView1_TreeNodeCheckChanged(object sender, TreeNodeEventArgs e) { //string str=e.Node.ValuePath; //其他处理代码 }aspx中：<head runat="server"><script type="text/JavaScript"> function postBackByObject(){ __doPostBack("","");}</script></head>
以上代码来自http://blog.csdn.net/sl159/article/details/7921920
有一中改进的写入如下，但是Firefox不支持类似的var o = window.event.srcElement;的写法，(IE没问题)，所以也没有用到
// 点击复选框时触发事件（此事件会引起回发） function postBackByObject() { var o = window.event.srcElement; if (o.tagName == "INPUT" && o.type == "checkbox") { __doPostBack("UpdatePanel1",""); //此处前面是两个下划线(UpdatePanel1处是因为用了UpdatePanel所以才写这个控件ID的) } }
摘抄于http://www.cnblogs.com/ranlin/archive/2011/08/07/2129874.html
使用TreeView 使用多选功能
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。