ASP.NET 2.0的导航控件treeview和menu的实例

原创 2007年09月21日 18:28:00

ASP.net2.0 为用户提供了treeview和menu导航控件,使用十分方便,极大提高了用户开发项目的速度和效率。

尤其是treeview和menu绑定web.sitemap之类的XML文件,形成层次数据非常便捷。

但我在项目开发过程中,很多地方是需要绑定关系数据库,毕竟关系数据库是最常用、操作最方便的存储形式。

对于treebview与关系数据库绑定可以动态绑定,也就是在page_load事件中首先添加第一级节点,然后在treeview的SelectedNodeChanged事件中进行判断添加下一级节点。因为使用AJAX技术后,把treeview控件放在UpdatePanel控件之内,用户的页面体验效果相当不错。

然而对于menu控件,这样就有麻烦了,因为我发现menu在UpdatePanel控件中有问题:就是移动鼠标后原来的菜单项会遗留在屏幕上,直到单击新的菜单项(不知道是bug,还是我哪里出现问题)。也许有人觉得menu不要动态绑定,直接绑定XML做成静态的多好!但在做项目时需要不同的用户登陆后出现的菜单效果不同,而在web.sitemap中roles角色控制又不是十分便利,所以使用关系数据库直接对menu菜单项的enabled进行赋值,控制更加灵活。

因为有bug,只能把menu控件放在UpdatePanel控件之外,对menu的绑定就要在page_load事件中一次性绑定,如果使用menu控件的MenuItemClick事件绑定,那么用户受不了这样的体验!

实现的效果如下:

ASP.NET 2.0的导航控件treeview和menu的实例

具体实现代码如下:

default.aspx

 1<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default4.aspx.vb" Inherits="Default4" %>
 2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3<html xmlns="http://www.w3.org/1999/xhtml" >
 4<head runat="server">
 5    <title>导航控件测试</title>
 6</head>
 7<body>
 8    <form id="form1" runat="server">
 9
10 
11        <asp:Menu ID="Menu1"
12            runat="server"
13            disappearafter="2000"
14            staticsubmenuindent="10px"
15            orientation="Horizontal"
16            StaticEnableDefaultPopOutImage="False"
17            BackColor="#E3EAEB"
18            DynamicHorizontalOffset="2"
19            Font-Names="宋体"
20            Font-Size="14px"
21            ForeColor="#666666" >
22        <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
23        <DynamicHoverStyle BackColor="#666666" ForeColor="White" />
24        <DynamicMenuStyle BackColor="#E3EAEB" />
25        <StaticSelectedStyle BackColor="#E3EAEB" />
26        <DynamicSelectedStyle BackColor="#E3EAEB" />
27        <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
28        <StaticHoverStyle BackColor="#666666" ForeColor="White" />
29        </asp:Menu>
30    
31    </form>
32</body>
33</html>

default.aspx.vb

 1Imports System
 2Imports System.Data
 3Imports System.Data.SqlClient
 4Partial Class Default4Class Default4
 5    Inherits System.Web.UI.Page
 6    Public strConn, strSQL As String
 7    Dim myConn As SqlConnection
 8   Dim mydv As DataView
 9    Dim i As Integer
10    Dim menunode As MenuItem
11    Protected Sub Page_Load()Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
12        strConn = System.Configuration.ConfigurationManager.AppSettings("connstring")
13        myConn = New SqlConnection(strConn)
14     
15        If Not Page.IsPostBack Then
16            strSQL = "select * from menu "
17            mydv = GetDataView(strSQL, "menu")
18            mydv.RowFilter = "parentid=0"
19            For i = 0 To mydv.Count - 1
20                menunode = New MenuItem
21                menunode.Text = mydv.Item(i).Item("text")
22                menunode.Value = mydv.Item(i).Item("id")
23                menunode.Enabled = mydv.Item(i).Item("Enabled")
24                menunode.Target = mydv.Item(i).Item("Target")
25                menunode.NavigateUrl = mydv.Item(i).Item("url")
26                Menu1.Items.Add(menunode)
27                addnode(menunode, menunode.Value)
28                mydv.RowFilter = "parentid=0"
29            Next
30        End If
31    End Sub
32
33    Sub addnode()Sub addnode(ByVal pnode As MenuItem, ByVal pid As Integer)
34        Dim menunode As MenuItem
35        Dim j As Integer
36        mydv.RowFilter = "parentid=" & pid
37        For j = 0 To mydv.Count - 1
38            menunode = New MenuItem
39            menunode.Text = mydv.Item(j).Item("text")
40            menunode.Value = mydv.Item(j).Item("id")
41            menunode.Enabled = mydv.Item(j).Item("Enabled")
42            menunode.Target = mydv.Item(j).Item("Target")
43            menunode.NavigateUrl = mydv.Item(j).Item("url")
44            pnode.ChildItems.Add(menunode)
45            addnode(menunode, menunode.Value)
46            mydv.RowFilter = "parentid=" & pid
47        Next
48
49    End Sub
50
51    Function GetDataView()Function GetDataView(ByVal Sql As String, ByVal strTable As String) As DataView
52        Dim myDataAdapter As SqlDataAdapter
53        Dim myDataSet As DataSet
54        myConn.Open()
55        myDataAdapter = New SqlDataAdapter(Sql, myConn)
56        myConn.Close()
57        myDataSet = New DataSet
58        myDataAdapter.Fill(myDataSet, strTable)
59        GetDataView = New DataView(myDataSet.Tables(strTable))
60    End Function
61
62  
63End Class
64

数据库结构如下:

ASP.NET 2.0的导航控件treeview和menu的实例

上面实现的关键是:

1、addnode递归过程,实现下级节点的添加;

2、DataView的RowFilter属性,mydv.RowFilter = "parentid=" & pid,筛选出某节点的下级节点,进行添加。

以上代码,没有优化,也不一定是最好的,希望抛砖引玉!

 

网站导航——网站地图和TreeView的使用

ASP.NET站点导航能够在一个中央位置存储指向所有页面的连接,并在列表中呈现这些连接,也可以使用一个特定的Web服务器控件在每个页面上呈现导航菜单。设计站点导航时,使用站点地图描述站点的逻辑结构,使...
  • zc707212993
  • zc707212993
  • 2013年05月12日 19:44
  • 903

ASP.Net中menu控件使用

为了使用方便asp.net中提供了两类控件html控件与用户控件。这里不在详细介绍。menu属于用户控件。 menu最重要的是item属性,item包含了menu控件要显示的类表,几级菜单神马的,点...
  • jianxia_wzx
  • jianxia_wzx
  • 2013年05月22日 09:51
  • 3636

ASP.NET2.0 menu控件制作下拉式导航菜单

步骤:1. XML文件。这里用XML文档:slivermenu.xml描述了菜单的具体内容。如 xml version="1.0" encoding="utf-8" ?>items>  menuite...
  • smalltt
  • smalltt
  • 2008年04月20日 16:24
  • 4362

ASP.net基础(九)网站导航--网站导航及导航控件

  • xhf55555
  • xhf55555
  • 2012年12月19日 20:57
  • 6219

asp.net treeview 控件的使用

    TreeView 是 ASP.NET 的 Navigation 中的一个控件,实际上就是我们平时所说的树型菜单。 在视图设计中添加 TreeView。 HTML代码清单:后台代码清单:prot...
  • liumqj
  • liumqj
  • 2011年06月16日 11:54
  • 4896

教你如何用TreeView树形菜单创建像CSDN左边那样的导航之一:如何安装配置TreeView

第一步:下载安装IE WEB CONTROLS下载地址:http://msdn.microsoft.com/archive/en-us/samples/internet/asp_dot_net_ser...
  • xft_1981
  • xft_1981
  • 2007年04月29日 10:45
  • 925

c#语言asp.net实现treeview控件

  从数据库里读数据就不写了吧?假设你得到了一个存放数据实体数组叫emps[],里面放的全是emp实体.                foreach (Emp item in emps)      ...
  • baiyun789
  • baiyun789
  • 2011年01月21日 13:42
  • 2821

关于ASP.NET中TreeView控件的一些体会

这是一个自定义控件文件的两部分
  • carrousel0516
  • carrousel0516
  • 2010年10月19日 23:26
  • 1072

asp.net TreeView控件的用法

html   asp:Panel id="panel1" runat="server" Height="300" ScrollBars="Auto">                         ...
  • chinaly
  • chinaly
  • 2008年09月19日 14:15
  • 5747

ASP.NET 2.0 - 导航(Navigation):treeview/menu

http://www.w3school.com.cn/aspnet/aspnet_navigation.asp注意:siteMapNode 里的url必须写上,否则页面上不显示网站导航维护大型站点的导...
  • wyqlxy
  • wyqlxy
  • 2010年12月03日 14:16
  • 927
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ASP.NET 2.0的导航控件treeview和menu的实例
举报原因:
原因补充:

(最多只允许输入30个字)