ASP.NET的面包屑導航控件、樹形導航控件、菜單控件

原文：http://blog.csdn.net/pan_junbiao/article/details/8579293

ASP.NET的面包屑導航控件、樹形導航控件、菜單控件。

1、 面包屑導航控件——SiteMapPath控件

SiteMapPath控件可以為站點提供“面包屑導航”的功能。

1.1 創建站點地圖文件Web.sitemap

在ASP.Net中，有一個叫站點地圖的XML文件。站點地圖的文件名必須是Web.sitemap，而且需要放置於應用程序的根目錄。

 

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
<siteMapNode url="" title="人力資源管理" description="">
<siteMapNode url="" title="員工管理" description="">
<siteMapNode url="/Manager/UserList.aspx" title="員工列表" description="" />
<siteMapNode url="/Manager/AddUser.aspx" title="新增員工" description="" />
</siteMapNode>
<siteMapNode url="" title="部門管理" description="">
<siteMapNode url="/Manager/DepartmentList.aspx" title="部門列表" description="" />
<siteMapNode url="/Manager/AddDepartment.aspx" title="新增部門" description="" />
</siteMapNode>
</siteMapNode>
</siteMap>

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
    <siteMapNode url="" title="人力資源管理"  description="">
      <siteMapNode url="" title="員工管理"  description="">
        <siteMapNode url="/Manager/UserList.aspx" title="員工列表"  description="" />
        <siteMapNode url="/Manager/AddUser.aspx" title="新增員工"  description="" />
      </siteMapNode>
      <siteMapNode url="" title="部門管理"  description="">
        <siteMapNode url="/Manager/DepartmentList.aspx" title="部門列表"  description="" />
        <siteMapNode url="/Manager/AddDepartment.aspx" title="新增部門"  description="" />
      </siteMapNode>
    </siteMapNode>
</siteMap>

節點描述如下：

 

siteMap：根節點，一個站點地圖只能有一個siteMap元素。

siteMapNode：對應於頁面的節點，一個節點描述一個頁面。

title：描述頁面。

url：文件在解決方案中的位置。

description：說明性文本。

編寫站點地圖的注意事項如下：

1、站點地圖根節點為<siteMap>元素，每個文件有且僅有一個根節點。

2、<siteMap>下一級有且僅有一個<siteMapNode>節點。

3、<siteMapNode>下面包含多個新的<siteMapNode>節點。

4、在站點地圖中，同一個URL僅能出現一次。

1.2 頁面中編寫SiteMapPath控件

 

<asp:SiteMapPath ID="SiteMapPath1" runat="server">
</asp:SiteMapPath>

<asp:SiteMapPath ID="SiteMapPath1" runat="server">
</asp:SiteMapPath>

 

SiteMapPath控件的常用屬性

PathSeparator：控制分隔符。可以通過編輯模板更改分隔符為任意樣式，比如為圖片。

ParentLevelsDisplayed：要顯示的父節點的級數，用於控制導航顯示的級數。

 

2、 樹形導航——TreeView控件

ASP.NET中有TreeView導航控件，可以像SiteMapPath那樣設置一下XML文件即可顯示強大的導航。

2.1 編寫XML文件——ManagerMenu.xml

也可以采用站點地圖Web.sitemap作為TreeView的數據源

 

<?xml version="1.0" encoding="utf-8" ?>
<siteMapNode url="" title="人力資源管理" description="">
<siteMapNode url="" title="員工管理" description="">
<siteMapNode url="/Manager/UserList.aspx" title="員工列表" description="" />
<siteMapNode url="/Manager/AddUser.aspx" title="新增員工" description="" />
</siteMapNode>
<siteMapNode url="" title="部門管理" description="">
<siteMapNode url="/Manager/DepartmentList.aspx" title="部門列表" description="" />
<siteMapNode url="/Manager/AddDepartment.aspx" title="新增部門" description="" />
</siteMapNode>
</siteMapNode>

<?xml version="1.0" encoding="utf-8" ?>
<siteMapNode url="" title="人力資源管理"  description="">
    <siteMapNode url="" title="員工管理"  description="">
      <siteMapNode url="/Manager/UserList.aspx" title="員工列表"  description="" />
      <siteMapNode url="/Manager/AddUser.aspx" title="新增員工"  description="" />
    </siteMapNode>
    <siteMapNode url="" title="部門管理"  description="">
      <siteMapNode url="/Manager/DepartmentList.aspx" title="部門列表"  description="" />
      <siteMapNode url="/Manager/AddDepartment.aspx" title="新增部門"  description="" />
    </siteMapNode>
</siteMapNode>

 

2.2 頁面中編寫TreeView控件與綁定數據源

 

<asp:TreeView ID="TreeView1" runat="server" DataSourceID="XmlDataSource1" ShowLines="True">
<DataBindings>
<asp:TreeNodeBinding DataMember="siteMapNode" NavigateUrlField="url" TextField="title" />
</DataBindings>
</asp:TreeView>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/Manager/ManagerMenu.xml"></asp:XmlDataSource>

<asp:TreeView ID="TreeView1" runat="server" DataSourceID="XmlDataSource1" ShowLines="True">
    <DataBindings>
        <asp:TreeNodeBinding DataMember="siteMapNode" NavigateUrlField="url" TextField="title" />
    </DataBindings>
</asp:TreeView>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/Manager/ManagerMenu.xml"></asp:XmlDataSource>

 

TreeView數據綁定的常用屬性

TextField：設置顯示的文字所綁定的字段或元素。

NavigateUrlField：設置鏈接對應的字段或元素值。

 

3、 菜單控件——Menu控件

ASP.NET中Menu控件，它提供一種動態和靜態結合的方式進行菜單的顯示。

3.1 頁面中編寫Menu控件與綁定數據源。

 

<asp:Menu ID="Menu1" runat="server" DataSourceID="XmlDataSource2" Orientation="Horizontal">
<DataBindings>
<asp:MenuItemBinding DataMember="siteMapNode" NavigateUrlField="url"
TextField="title" />
</DataBindings>
</asp:Menu>
<asp:XmlDataSource ID="XmlDataSource2" runat="server" DataFile="~/Manager/ManagerMenu.xml"></asp:XmlDataSource>

<asp:Menu ID="Menu1" runat="server" DataSourceID="XmlDataSource2" Orientation="Horizontal">
    <DataBindings>
        <asp:MenuItemBinding DataMember="siteMapNode" NavigateUrlField="url" 
            TextField="title" />
    </DataBindings>
</asp:Menu>
<asp:XmlDataSource ID="XmlDataSource2" runat="server" DataFile="~/Manager/ManagerMenu.xml"></asp:XmlDataSource>