您的位置：首页 > 数据库

TreeView学习笔记

2003-05-22 08:28 906 查看

1．什么是TreeView?<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

   TreeView 是一个 ASP.NET 服务器控件，可以生成用于显示分层数据的用户界面

2．适用的数据结构：

    适用分层的数据集、文件夹视图以及其他类似的数据结构。

3．如何实现TreeView?

   (1)通过声明的方式创建

(2)客户端或服务器上通过编程以多种方式来实现

4．TreeView创建方法：

   (1)手动创建

   (2) 使用vs.net中的 TreeView Editor创建

5．TreeView元素

   TreeView      定义一个TreeView

   TreeNodeType 定义一个节点类型，适用TreeView中的一个或一组节点

   TreeNode      在TreeView中创建一个节点

注：

   TreeView是TreeNode和TreeNodeType的容器

   这些元素共同定义了数视图的结构、布局、外

观。TreeView不能包含这三种元素之外的任何

HTML元素

6．编写简单的 TreeView

   (1).创建一个web application,命名为：webcontrols

   (2).创建一个空页面

   (3).添加命名空间引用，即添加 “<%@ import namespace="Microsoft.Web.UI.WebControls" %>”

   (4).添加@ Register 指令

      即添加：

          <%@ Register TagPrefix="mytree"

Namespace="Microsoft.Web.UI.WebControls"

Assembly="Microsoft.Web.UI.WebControls,Version=1.0.2.226,Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>

   (5). 添加文档结构

       <HTML>

<HEAD></HEAD>

<BODY></BODY>

</HTML>

   (6).添加form

      所有 WebControl 元素必须在一个 FORM 元素中建立

<BODY>

<FORM runat="server"></FORM>

</BODY>

   (7). 添加一个 TreeView 元素。

<BODY>

    <FORM runat="server">

     <mytree:treeview runat="server"></mytree:treeview>

     </FORM>

</BODY>

     (8). 向 TreeView 添加一个 TreeNode。

<mytree:treeview runat="server">

        <mytree:treenode text="节点一">

        </mytree:treenode>

</mytree:treeview>

     (9). 添加第二个 TreeNode。

<mytree:treeview runat="server">

         <mytree:treenode text="节点一">

                <mytree:treenode text="节点二">

                </mytree:treenode>

           </mytree:treenode>

</mytree:treeview>

7．数据绑定

    TreeView 也支持数据绑定，因此可以生成动态的内容，下面的示例显示的 TreeView 与前一个示例类似，但没有使用静态内容，而是使用了可扩展标记语言 (XML) 文件来提供 UI 的数据源

<booktree:treeview runat="server" AutoPostBack="true">

<booktree:treenode Text="book" AutoPostBack=true "

   Expanded="true" TreeNodeSrc="http:// EventArgs/webcontrols/treeview/book.xml">

</booktree:treenode>

</booktree:treeview>

book.xml 文件包含以下内容：

<TREENODES>

      <treenode Text="CSharp">

         <treenode Text="Deep inside Csharp"/>

         <treenode Text="Advanced Csharp"/>

         <treenode Text="Extend Csharp"/>

      </treenode>

      <treenode Text="VBdotNet" >

         <treenode Text="vb.net leader"/>

         <treenode Text="From vb to vb.net"/>

         <treenode Text="Dotnet with VB.net"/>

      </treenode>

</TREENODES>

8．用 XML 和 SQL Server 进行数据绑定

WebControls 元素也可以使用其他 XML 数据提供程序，如下所示：

<ie:treenode Text="root" type="tree" Expanded="true"

TreeNodeSrc="http://EventArgs/mySQLXML?sql=execute+sp_bookXML+@pid=1" />

该示例使用了一种更高级的技术。TreeNodeSrc 属性被设置为一个 URL，后者执行 Microsoft SQL Server(tm) 数据库上的一个存储过程来动态生成 XML 数据岛。

9．编程

前面给出的示例表明，多数情况下编写一个功能完备的 UI 元素不需要任何编程工作。本节简要介绍一些可用于 TreeView 的简单的脚本编写技术。

TreeView 事件

通过将 AutoPostBack 属性设置为 true 可以将用户交互产生的事件导向服务器。同时处理高级浏览器和低级浏览器事件时应该使用服务器端脚本，因为低级页面内容中没有使用 Internet Explorer 5.5 或更高版本中所使用的丰富的 DHTML 行为。

对于包含 TreeView 的 Web 页面，用户的主要交互是展开和折叠树中的节点来浏览内容。下面的示例代码显示了如何使用 C# 在 Web 窗体中处理 onexpand、oncollapse 和 onselectedindexchange 事件。

<script language="C#" runat="server">

void Expand(object sender, TreeViewClickEventArgs e)

{

mylabel.InnerText += "已展开 (节点索引= " + e.Node.ToString() + ")";

}

void Collapse(object sender, TreeViewClickEventArgs e)

{

mylabel.InnerText += "已折叠 (节点索引= " + e.Node.ToString() + ")";

}

void SelectChange(Object sender, TreeViewSelectEventArgs e)

{

mylabel.InnerText += "已选中 " + e.NewNode.ToString() + " (旧节点

索引=" + e.OldNode.ToString()+")" ;

}

</script>

在此脚本中，需要具有一个 id 为 _label 的元素。

<div id=_label runat="server">Event Log: </div>

注意：此标记必须放在 TreeView 使用的 FORM 元素内。

可以通过编程或使用 TreeView 的属性将 C# 脚本中的函数加入到事件中，如下所示：

<mytree:treeview

onexpand="Expand"

oncollapse="Collapse"

onselectedindexchanged="SelectChange"

autopostback="true"

runat="server">

</mytree:treeview>

进行 TreeView 编程时经常要使用 onexpand 和 oncollapse 事件。在本示例中，每次节点展开或折叠时，脚本都将添加到 div 元素的 innerText 中。

服务器端包含

由于 WebControls 是用 ASP.NET 建立的，所以也支持服务器端“包含”。下面的示例显示了其实现方法。

<mytree:treeview runat="server">

    

</mytree:treeview>

前面的示例使用了 nodes.txt 文件来填充一个 TreeView，下面我们使用包含文件来填充 TreeView 的两个单独的 TreeNode 分支。

<mytree:treeview runat="server">

    <mytree:treenode Text="书籍" >

        

    </mytree:treenode>

    <mytree:treenode Text="杂志" >

        

    </mytree:treenode>

</mytree:treeview>

与 XML 数据绑定的命名空间前缀规则不同，包含文件的内容中的元素必须使用与其父元素相同的标记前缀。因此，books.txt 和 magazines.txt 文件的内容应使用 mytree 标记前缀。

                                                                                                                                             秦汉唐

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： webcontrols server vb.net sql server 服务器 asp.net

相关文章推荐

新的分享

章节导航