treeview的使用!

tl_pear 2005-03-29 04:40:17
第一次使用treeview,我遇到这样的问题,
我把autopostback="true"则我每点一次,它都会返回最初始状态,也就是接点没有展开的状态!
我把autopostback="false"则我每点一次,他不会响应事件,如click
我希望解决的问题:
1:怎么样使我点击一个节点,不会返回最初始状态,而可以捕做到click事件
2:怎么样实现csdn这样的界面。
...全文
650 29 打赏 收藏 转发到动态 举报
写回复
用AI写文章
29 条回复
切换为时间正序
请发表友善的回复…
发表回复
bczy 2005-04-28
  • 打赏
  • 举报
回复
我也要一份,谢谢 bczy@eyou.com
或者请“不知名”公布一下QQ号,用QQ传
ldpldy 2005-04-22
  • 打赏
  • 举报
回复
mark
ghostcug 2005-04-09
  • 打赏
  • 举报
回复
有没有人用asp2.0的treeview阿
lxl97241 2005-04-04
  • 打赏
  • 举报
回复
给我一份,谢谢!
lxl97241@sohu.com
buzhiming99 2005-03-31
  • 打赏
  • 举报
回复
已发
tl_pear 2005-03-31
  • 打赏
  • 举报
回复
谢谢!
base1980@163.com
jacksom 2005-03-30
  • 打赏
  • 举报
回复
可以改用調用XML資料格式還是要好得多。
tl_pear 2005-03-30
  • 打赏
  • 举报
回复
大家帮帮忙呀!
UP也可以!
tl_pear 2005-03-30
  • 打赏
  • 举报
回复
to: lovelxj(我是谁?) ( )
那具体怎么实现呢?
lovelxj 2005-03-30
  • 打赏
  • 举报
回复
客户端的treeview 的意思就是用存JS来实现吧。。 这样就不需要ASP。NET的支持。。
tl_pear 2005-03-30
  • 打赏
  • 举报
回复
to:: saintess() ( )

下面这句应该怎么理解?
string strScript = "<script language=\"JavaScript\"> \n" + "<!-- \n" + " function initTree() { \n" +" " + strTreeName + ".onSelectedIndexChange = function() { \n" + "if (event.oldTreeNodeIndex !=
event.newTreeNodeIndex) \n" + "this.queueEvent('onselectedindexchange', event.oldTreeNodeIndex + ',' + event.newTreeNodeIndex); \n" + "window.setTimeout('" + strRef.Replace("'","\\'") + "', 0, 'JavaScript'); \n" + " } \n" + " } \n" + "// --> \n" + "</script>";
tl_pear 2005-03-30
  • 打赏
  • 举报
回复
to net_lover(孟子E章) ( )
用用客户端的treeview,我怎么响应SelectedIndexChanged事件?
或者说是通过什么样的原理来实现?
buzhiming99 2005-03-30
  • 打赏
  • 举报
回复
又打错字了,不会装IEWebControls先去学怎么装。
或者哪位帮忙提供个空间
buzhiming99 2005-03-30
  • 打赏
  • 举报
回复
写了个简单的例子,要的留个mail,不用装IEWebControls的就别留了
buzhiming99 2005-03-30
  • 打赏
  • 举报
回复
大致这样,一些简单的就不写了:
treeviewDemo.ascx(里面放个treeview并设为AutoPostBack = true)
public delegate void SelectedChanged(); //ps1:可以自己加需要的参数

public SelectedChanged OnSelectedChanged;
在selectedChanged的事件中:
if (OnSelectedChanged!= null)
{
OnSelectedChanged(); //同ps1
}

main.aspx
在OnInit中
this.用户控件.TreeViewDemo.OnSelectedChanged+= new Controls.treeview.SelectedChanged(this.SelectedChanged)

然后自己定义个private SelectedChanged() {
这里对另外一个用户控件做更新
}

如此,TreeView的选择变化实际上已经委托给main.aspx.SelectedChanged去处理
lyb_abiandbel 2005-03-30
  • 打赏
  • 举报
回复
tl_pear(飘叶寻梦)
我也想知道啊!
JophyWu 2005-03-30
  • 打赏
  • 举报
回复
buzhiming99(不知名)
可以给个简单的例子吗??
morality 2005-03-30
  • 打赏
  • 举报
回复
两个客户端操作TreeView节点CheckBox的小例子 选择自 hgknight 的 Blog
关键字 TreeView CheckBox javascript
出处

最近在论坛上回答了一些关于客户端操作TreeView节点选中的问题,在网友提供的代码基础上做了两个例子。可惜原贴已经丢失了,整理一下写成文档吧
为了书写方便,这两个例子没有采用codebehind方式,复制即可运行

第一个例子是当取消或选中节点选中状态时,子节点也做相应的取消或选中变化
需要注意的是如果要初始设置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>



morality 2005-03-30
  • 打赏
  • 举报
回复
TreeView使用集锦 选择自 hgknight 的 Blog
关键字 TreeView
出处

原来在论坛里发过专题帖子,只是由于帖子丢失原因,有些问题找不到了,同时这次也补充了一些,发到文档区以方便查询吧
原贴
http://expert.csdn.net/Expert/topic/1525/1525202.xml

1.下载地址
http://msdn.microsoft.com/downloads/samples/internet/ASP_DOT_NET_ServerControls/WebControls/default.asp
下载后是后缀为bat的版本
(1)bulid.将bulid.bat的路径指向csc.exe所在路径,生成Microsoft.Web.UI.WebControls.dll。
(2)在wwwroot下创建空目录webctrl_client\1_0。
(3)将build\Runtime下的文件拷至webctrl_client\1_0下。
(4)选择工具箱的自定义工具箱,添加Microsoft.Web.UI.WebControls.dll。
有些麻烦
但如果你能找到后缀是msi的自动安装版本,直接下一步就行(我一直用这个版本,hoho)
安装后,通过“自定义工具箱”->“.net框架组件”把TreeView添加到工具箱里

2.运行时无法显示
一般是TreeView的版本问题,最好下载英文版自动安装版本重新安装,安装前应该先到添加删除程序里卸掉原版本

3.显示格式出错(非树状显示)
TreeView要求客户端浏览器版本为IE5.5及以上,最好要求客户端升级为IE6.0

4.框架里使用TreeView
设置NavigateUrl、Target属性,可更新另外的Frame

5.找不到TreeNode类
使用TreeView,最好添加namespace:using Microsoft.Web.UI.WebControls;

6.遍历TreeView节点(递归算法)
private void Page_Load(object sender, System.EventArgs e)
{
GetAllNodeText(TreeView1.Nodes);
}
void GetAllNodeText(TreeNodeCollection tnc)
{
foreach(TreeNode node in tnc)
{
if(node.Nodes.Count!=0)
GetAllNodeText(node.Nodes);
Response.Write(node.Text + " ");
}
}

7.得到node结点的父节点
TreeNode pnode;
if(node.Parent is TreeNode)
pnode=(TreeNode)node.Parent;
else
//node is root node

8.修改TreeView样式(示例)
<iewc:TreeView id="TreeView1" runat="server" HoverStyle="color:blue;background:#00ffCC;" DefaultStyle="background:red;color:yellow;" SelectedStyle="color:red;background:#00ff00;">
用代码:
TreeView1.DefaultStyle["font-size"] = "20pt";

9.展开时不提交,改变选择节点时才提交
将autopostback设置成false;
在body里添加 <body onload="initTree()">
然后在PageLoad里写:
string strTreeName = "TreeView1";
string strRef = Page.GetPostBackEventReference(TreeView1);
string strScript = "<script language=\"JavaScript\"> \n" + "<!-- \n" + " function initTree() { \n" +" " + strTreeName + ".onSelectedIndexChange = function() { \n" + "if (event.oldTreeNodeIndex !=
event.newTreeNodeIndex) \n" + "this.queueEvent('onselectedindexchange', event.oldTreeNodeIndex + ',' + event.newTreeNodeIndex); \n" + "window.setTimeout('" + strRef.Replace("'","\\'") + "', 0, 'JavaScript'); \n" + " } \n" + " } \n" + "// --> \n" + "</script>";
Page.RegisterClientScriptBlock("InitTree",strScript );

这样就只有你点击的节点更改的时候才提交!

10.TreeView结合XML
把XML文件设置为如下格式,然后直接设置TreeNodeSrc为该XML文件就行
<?xml version="1.0" encoding="GB2312"?>
<TREENODES>
<TREENODE TEXT="node0" EXPANDED="true">
<TREENODE TEXT="node1"/>
<TREENODE TEXT="node2"/>
</TREENODE>
<TREENODE TEXT="node3" NavigateURL="3.aspx"/>
</TREENODES>
或者用代码
TreeView1.TreeNodeSrc="a.xml";
TreeView1.DataBind();



客户端控制TreeView
http://expert.csdn.net/Expert/topic/1382/1382892.xml

1.设置所选节点,如选中第二个节点
function SetSelNode()
{
TreeView1.selectedNodeIndex="1";
}

2.得到所选节点的Text,ID或NodeData
function GetAttribute()
{
alert(TreeView1.getTreeNode(TreeView1.selectedNodeIndex).getAttribute("Text"));
}
替换Text为ID或NodeData,可分别得到所选节点的ID或NodeData

3.修改节点属性,如修改第一个节点的Text
function ModifyNode()
{
var node=TreeView1.getTreeNode("0");
node.setAttribute("Text","hgknight");
}

4.得到点击节点
function TreeView1.onclick()
{
alert(TreeView1.getTreeNode(TreeView1.clickedNodeIndex).getAttribute("Text"));
}

5.添加节点
function AddNode()
{
var node=TreeView1.createTreeNode();
node.setAttribute("Text","hgknight");
TreeView1.add(node);
}

6.js遍历所有节点
var AllRootNode=new Array();
AllRootNode=TreeView1.getChildren();
AlertNode(AllRootNode);

function AlertNode(NodeArray)
{
if(parseInt(NodeArray.length)==0)
return;
else
{
for(i=0;i<NodeArray.length;i++)
{
var cNode;
cNode=NodeArray[i];
alert(cNode.getAttribute("Text"));
if(parseInt(cNode.getChildren().length)!=0)
AlertNode(cNode.getChildren());
}
}
}


lyb_abiandbel 2005-03-30
  • 打赏
  • 举报
回复
我也在学习treeview,关注!
加载更多回复(9)
一、简介 通过这个课程带大家从零开发一款功能全面的后台管理系统,包括项目搭建、功能实现到最后的Linux系统部署全过程。本课程使用SpringMVC + Spring + Mybatis作为主体框架,使用AdminLTE作为前端框架,使用主流关系型数据库Mysql作为存储数据库,使用非关系型数据库Redis作为缓存数据库,并集成SpringSecuriy安全框架做权限的动态管理,集成Swagger2自动生成接口文档,集成Druid连接池进行SQL性能监控,集成ActiveMQ消息中间件进行异步解耦,提高性能。最后使用linux系统进行服务部署,并搭建nginx反向代理服务器提高网站性能。 二、学习目标 通过本课程的学习带大家掌握SSM框架的开发流程,并熟练使用SpringSecurity做为安全框架进行权限管理,整合相关优秀的开源框架进行功能开发。还在项目中带大家学习前端相关的Jquery、Bootstrap等知识。课程结束之后希望大家能做到独立进行开发项目的目的,增强解决问题的能力,具备功能落地实现的能力。 三、课程涉及知识点 SpringMVC源码分析Mybatis源码分析通用MapperMysql数据库Redis缓存实现ActiveMQ消息中间件SpringSecurity鉴权Swagger2接口文档生成自定义注解AOP切面编程自定义过滤器Logback日志整合Druid性能监控Linux系统Nginx反向代理Ajax异步请求技术Jquery基本使用AdminLTE前端框架Chart图表-线状图和饼状图百度地图定位城市BootStrap前端框架BootStrap-Table插件BootStrap-Treeview插件Markdown编辑器403、404、500错误页面配置数据库事务消息提示插件toastr.js图片上传插件bootstrap fileinput数字滚动效果pv/uv流量统计...四、课程部分内容截图如下 1、首页 2、菜单管理 3、图床管理 4、图标管理 5、留言反馈管理 6、druid监控 7、登录日志

62,041

社区成员

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见,支持健康理性的辩论和互动,反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧