TreeView安装使用集锦

caozuiba

浏览: 901986 次

最近访客更多访客>>

wangyy

u012363178

langke93

Torero

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (1386)

社区版块

存档分类

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" + "</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();

11.请问，在页面加载时，如何选中Treeview某一节点?

index属性，是一个如1.1.0的东西，解析这个字符串，然后定位

private void ExpandNode(string selID)//selID like 1.1.0
{
char[] mySplit = new char[]{'.'};
string [] nodeArray = selID.Split(mySplit);

TreeNode myNode = null;
for(int i=0;i<nodeArray.Length;i++)
{
if(i==0)
myNode = tree.Nodes[Convert.ToInt32(nodeArray[i])];
else
myNode = myNode.Nodes[Convert.ToInt32(nodeArray[i])];

myNode.Expanded = true;
tree.SelectedNodeIndex = myNode.GetNodeIndex();
}
}

客户端控制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);

--------------------------------------------------------------------------------------------------------------------------------------------------------

<iewc:treeview id="TreeView1" runat="server" wilth="100%" AutoSelect="True" BorderWidth="2px" Target="main"
ExpandedImageUrl="images/fopen.gif" SelectedImageUrl="images/bookmark.gif" ImageUrl="images/fclose.gif"
BorderColor="AliceBlue" BackColor="#ffffcc" SystemImagesPath="../webctrl_client/1_0/treeimages/"
SelectExpands="True" ExpandLevel="1"></iewc:treeview>
-----------------

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Data.SqlClient;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using Microsoft.Web.UI.WebControls;
namespace aspnetc.admin
{
/// <summary>
/// left 的摘要说明。
/// </summary>
public class left : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Label lblName;
protected Microsoft.Web.UI.WebControls.TreeView TreeView1;
protected System.Web.UI.WebControls.HyperLink hlkLogOut;
protected System.Web.UI.WebControls.Label Label2;

ClassConn connE = new ClassConn();

private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
if (!IsPostBack)
{
lblName.Text=Session["userName"]!=null ? Session["userName"].ToString():string.Empty;
try
{
//添加命令，从数据库中得到数据
SqlDataAdapter ada = new SqlDataAdapter("select * from menues where state=1 order by sortIndex",connE.GetConn());
DataSet ds=new DataSet();
ada.Fill(ds);
this.ViewState["ds"]=ds;
}
catch (Exception ex)
{
throw (ex);
}
finally
{
connE.Close();
}
//调用递归函数，完成树形结构的生成
AddTree(0, (TreeNode)null);
}
}

#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}

/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);

}
#endregion

/// <summary>
/// 递归添加树的节点
/// </summary>
/// <param name="ParentID"></param>
/// <param name="pNode"></param>
public void AddTree(int ParentID,TreeNode pNode)
{
DataSet ds=(DataSet) this.ViewState["ds"];
DataView dvTree = new DataView(ds.Tables[0]);
//过滤ParentID,得到当前的所有子节点
dvTree.RowFilter = "[parentId] = " + ParentID;

foreach(DataRowView Row in dvTree)
{
TreeNode Node=new TreeNode() ;
if(pNode == null)
{ //添加根节点
Node.Text = Row["name"].ToString();
TreeView1.Nodes.Add(Node);
//Node.Expanded=false;//是否展开若设置为true 则ExpandLevel="1"无效
AddTree(Int32.Parse(Row["ID"].ToString()), Node); //再次递归
}
else
{

if(4>3)
{
//添加当前节点的子节点
Node.Text = Row["name"].ToString();
//Node.Target = mainFrame;
Node.NavigateUrl = Row["url"].ToString();
pNode.Nodes.Add(Node);
//Node.Expanded = false;
AddTree(Int32.Parse(Row["ID"].ToString()),Node); //再次递归
}
}
}
}

}
}
----------------------------------------------------------------------------------------------------------------------------------------

http://www.microsoft.com/china/MSDN/library/archives/library/DNAspp/html/aspnet-usingtreeviewieWebcontrol.asp

IEWebControl TreeView右键菜单实例 选择自 hgknight 的 Blog

一个IEWebControl TreeView右键菜单的例子，实现了添加、修改和删除功能，复制即可运行
更多TreeView的客户端操作参见
http://www.csdn.net/Develop/read_article.asp?id=22100

<%@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls, Version=1.0.2.226, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<HTML>
<HEAD>
<title>TreeView控件右键菜单</title>
<style>

</style>
</HEAD>
<body onclick="hideMenu()">
<form id="TreeView" method="post" runat="server">
<iewc:TreeView id="TreeView1" runat="server" ExpandLevel="3" HoverStyle="color:blue;background:#ffff00;">
<iewc:TreeNode Text="Node0" Expanded="True">
<iewc:TreeNode Text="Node3">
<iewc:TreeNode Text="Node5"></iewc:TreeNode>
<iewc:TreeNode Text="Node6"></iewc:TreeNode>
</iewc:TreeNode>
<iewc:TreeNode Text="Node4"></iewc:TreeNode>
</iewc:TreeNode>
<iewc:TreeNode Text="Node1" Expanded="True">
<iewc:TreeNode Text="Node7">
<iewc:TreeNode Text="Node8"></iewc:TreeNode>
</iewc:TreeNode>
</iewc:TreeNode>
<iewc:TreeNode Text="Node2" Expanded="True">
<iewc:TreeNode Text="Node9"></iewc:TreeNode>
<iewc:TreeNode Text="Node10">
<iewc:TreeNode Text="Node11"></iewc:TreeNode>
<iewc:TreeNode Text="Node12"></iewc:TreeNode>
</iewc:TreeNode>
</iewc:TreeNode>
</iewc:TreeView>
<div id="popupMenu" class="skin" onMouseover="highlighItem()" onMouseout="lowlightItem()" onClick="clickItem()">
<div class="menuitems" func="add">添加</div>
<hr>
<div class="menuitems" func="delete">删除</div>
<div class="menuitems" func="modify">修改</div>
</div>
</form>
<script language="javascript">
var menuskin = "skin";
var node = null;

function hideMenu()
{
popupMenu.style.visibility = "hidden";
}

function highlighItem()
{
if (event.srcElement.className == "menuitems")
{
event.srcElement.style.backgroundColor = "highlight";
event.srcElement.style.color = "white";
}
}

function lowlightItem()
{
if (event.srcElement.className == "menuitems")
{
event.srcElement.style.backgroundColor = "";
event.srcElement.style.color = "black";
window.status = "";
}
}

private void SetAllNodeData(TreeNodeCollection tnc)
{

foreach(TreeNode node in tnc)
{
if(node.Nodes.Count!=0)
{
SetAllNodeData(node.Nodes);
}
if (node.Checked)
{
node.Checked = false;
}
else
{
node.Checked = true;
}

}
}
包括TreeView的asp.net程序的打包问题:
http://ttyp.cnblogs.com/archive/2005/06/01/165621.html
http://community.csdn.net/Expert/topic/4300/4300558.xml?temp=.7716028

在web.config加入以下节

<sectionname="MicrosoftWebControls"type="System.Configuration.NameValueSectionHandler,System,Version=1.0.5000.0,Culture=neutral,PublicKeyToken=b77a5c561934e089"/>

</configSections>

<addkey="CommonFiles"value="/web/treepath/"></add>

</MicrosoftWebControls>

注意:configSections一定要放在第一个子节最前面.

剪切默认网站的webctrl_client目录到虚拟目录web/treepath/下,运行程序,树型界面出现了,只是前面的加减号出现问题,再右键查看WEB代码,发现SystemImagesPath属性还是指到webctrl_client目录下,看了SystemImagesPath的代码,把treeview控件的SystemImagesPath设置为空,再次运行程序,OK!全部通过,treeview的图片目录再也不需要依赖默认网站的图片目录了,打包也变的方便了

下面是客户端操作TreeView带CheckBox的好例子(自动选择父节点下的所有子节点)不过里面有点小问题的

(1)就是如何初始化已经选择的节点:注意要从客户端初始化的(把选择的节点放在客户端一个隐藏域里通过JS初始化).如果你在服务器端初始化了将无法在客户端修改它的状态.

(2)如何获得客户端设置的节点:在客户端改变了选择状态(node.setAtrribute("check","ture"))后,通过服务器端是无法获得选择的值的,也只能在客户端获得它(通过一个input type="hiiden" runat="server"来保存选择的值).
上面两个问题都是参考了下面的代码完成的.

两个客户端操作TreeView节点CheckBox的小例子 (转江雨.net)(自动选择子节点)

TreeView节点的精确定位问题（通过NodeData来定位）

<sectionname="MicrosoftWebControls"type="System.Configuration.NameValueSectionHandler,System,Version=1.0.5000.0,Culture=neutral,PublicKeyToken=b77a5c561934e089"/>

</configSections>

<addkey="CommonFiles"value="/web/treepath/"></add>

</MicrosoftWebControls>

//Page_Load事件里根据NodeData来展开到到定位的节点

//这里是修改别人的(作者是根据Node的Text定位的.

FindInTree2(Request.QueryString["selectedNodeData"].ToString());

//根据NodeDate寻找节点

privatevoidFindInTree2(stringstrNodeData)

{

foreach(TreeNodetninTreeView1.Nodes)

{

if(tn.NodeData!=strNodeData)

{

FindInTree2(tn,strNodeData);

}

else

{

ExpandTree2(tn);

return;

}

//根据NodeDate寻找节点

privatevoidFindInTree2(TreeNodeobjTreeNode,stringstrNodeData)

{

foreach(TreeNodetninobjTreeNode.Nodes)

{

if(tn.NodeData!=strNodeData)

{

FindInTree2(tn,strNodeData);

}

else

{

ExpandTree2(tn);

return;

}

//根据NodeDate展开节点

privatevoidExpandTree2(TreeNodeobjTreeNode)

{

stringstrIndex="0";

objTreeNode.Expanded=true;

strIndex=objTreeNode.GetNodeIndex();

while(objTreeNode.ParentisTreeNode)

{

objTreeNode=((TreeNode)objTreeNode.Parent);

objTreeNode.Expanded=true;

}

TreeView1.SelectedNodeIndex=strIndex;

}

asp.net 2.0里TreeView已经集成了,不需要单独安装了,但现在偶觉得,他只是换汤不换药,特别是在节点定位,和客户端操作上这两个关键问题上没啥改进.(偶没用过只是看了它的介绍.)

ASP.NET 2.0 的TreeView 控件介绍(转载)

TreeView客户端操作在这里啊~~~~~~~~~~~~
http://msdn.microsoft.com/library/default.asp?url=/workshop/webcontrols/behaviors/library/TreeView/TreeView.asp

http://www.microsoft.com/china/msdn/archives/library/workshop/webcontrols/overview/treeview.asp

function hideMenu()
{
popupMenu.style.visibility = "hidden";
}

function highlighItem()
{
if (event.srcElement.className == "menuitems")
{
event.srcElement.style.backgroundColor = "highlight";
event.srcElement.style.color = "white";
}
}

function lowlightItem()
{
if (event.srcElement.className == "menuitems")
{
event.srcElement.style.backgroundColor = "";
event.srcElement.style.color = "black";
window.status = "";
}
}

<sectionname="MicrosoftWebControls"type="System.Configuration.NameValueSectionHandler,System,Version=1.0.5000.0,Culture=neutral,PublicKeyToken=b77a5c561934e089"/>

</configSections>

<addkey="CommonFiles"value="/web/treepath/"></add>

</MicrosoftWebControls>

<sectionname="MicrosoftWebControls"type="System.Configuration.NameValueSectionHandler,System,Version=1.0.5000.0,Culture=neutral,PublicKeyToken=b77a5c561934e089"/>

</configSections>

<addkey="CommonFiles"value="/web/treepath/"></add>

</MicrosoftWebControls>

//Page_Load事件里根据NodeData来展开到到定位的节点

//这里是修改别人的(作者是根据Node的Text定位的.

FindInTree2(Request.QueryString["selectedNodeData"].ToString());

//根据NodeDate寻找节点

privatevoidFindInTree2(stringstrNodeData)

{

foreach(TreeNodetninTreeView1.Nodes)

{

if(tn.NodeData!=strNodeData)

{

FindInTree2(tn,strNodeData);

}

else

{

ExpandTree2(tn);

return;

}

//根据NodeDate寻找节点

privatevoidFindInTree2(TreeNodeobjTreeNode,stringstrNodeData)

{

foreach(TreeNodetninobjTreeNode.Nodes)

{

if(tn.NodeData!=strNodeData)

{

FindInTree2(tn,strNodeData);

}

else

{

ExpandTree2(tn);

return;

}

//根据NodeDate展开节点

privatevoidExpandTree2(TreeNodeobjTreeNode)

{

stringstrIndex="0";

objTreeNode.Expanded=true;

strIndex=objTreeNode.GetNodeIndex();

while(objTreeNode.ParentisTreeNode)

{

objTreeNode=((TreeNode)objTreeNode.Parent);

objTreeNode.Expanded=true;

}

TreeView1.SelectedNodeIndex=strIndex;

}

分享到：

ASP.NET实现无刷新DropDownList联动 | 如何生成静态页

2005-12-07 09:34
浏览 1104
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论