在ASP.NET 2.0中使用頁面導航控制項
ASP.NET 2.0中使用sitemapdatasource頁面導航控制項
幾乎每個網站裡,為了方便使用者在網站中進行頁面導航,都少不了使用頁面導航控制項。有了頁面導航的功能,使用者可以很方便地在一個複雜的網站中進行頁面之間的跳轉。在以往的WEB編程中,要寫一個好的頁面導航功能,並不是那麼容易的,也要使用一些技巧。而在asp.net 2.0中,為了方便進行頁面導航,新增了一個叫做頁面導航控制項sitemapdatasource,sitemapdatasource中還可以綁定到不同的其他頁面控制項,比如treeview,menu等,十分靈活,使到能很方便地實現頁面導航的不同形式,而且還提供了運行時的編程介面,可以以編程的形式動態實現頁面導航控制項。本文將簡單以幾個例子來介紹一下在asp.net 2.0中sitemapdatasource如何?頁面導航。
頁面導航的結構和sitemapdatasource控制項
在asp.net 2.0中,要實現頁面導航,應該先以xml的形式,提供出整個網站的頁面結構層次。我們可以編寫一個叫web.sitemap的XML文字檔, 在該檔案中定義出整個要導航頁面的結構層次。舉例如下: 程式碼:<?xml version="1.0" encoding="utf-8" ?>
<siteMap>
<siteMapNode title="Default" description="Home" url="Default.aspx" >
<siteMapNode title="Members" description="Members" url="Members.aspx">
<siteMapNode title="My Account" description="My Account" url="MyAccount.aspx" />
<siteMapNode title="Products" description="Products" url="Products.aspx" />
</siteMapNode>
<siteMapNode title="Administration" description="Administration" url="~/Admin/Default.aspx">
<siteMapNode title="Customer" description="Customer Admin" url="~/Admin/Customer/default.aspx" />
<siteMapNode title="Products Admin" description="Products Admin" url="~/Admin/ProductsAdmin.aspx" />
</siteMapNode>
</siteMapNode>
</siteMap>
我們可以看到,其中,web.sitemap檔案必須包含根結點sitemap。而且,設定一個父sitemapnode結點,該結點表明是預設的網站首頁,在該父sitemapnode結點下,可以有若干個子sitemapnode結點,分別按階層代表了網站的各子欄目(留意一下上例中,各個子結點之間的內含項目關聯性)。而每一個sitemapnode結點中,有如下若干個屬性:
1)URL屬性:該屬性指出要導航的欄目的地址連結,在web.sitemap中定義中,必須是每個欄目的相對位址。
2)Title屬性:該屬性指出每個子欄目的名稱,顯示在頁面中。
3)Description屬性:該屬性指定時,則使用者在滑鼠移動到該欄目時,出現有關該欄目的相關提示,類似於tooltips屬性。
在設計好sitemap屬性後,接下來就可以一步步構建頁面導航功能了,主要有兩個步驟:
1) 向頁面中添加sitemapdatasource控制項。該控制項會自動感應綁定web.sitemap中的內容。
2) 將sitemapdatasource控制項綁定到如sitemappath,treeview,menu等控制項中,也就是說,將它們的資料來源設定為該sitemapdatasource控制項。
知道了方法後,我們下面就分別以treeview,menu,sitemappath三種控制項為例子,介紹一下如何和sitemapdatasource控制項進行配合使用。
先來介紹使用treeview控制項和sitemapdatasource 控制項配合使用的方法。Treeview樹形清單控制項十分適合於用來做頁面導航,為了能具體說明,我們充分利用asp.net中的masterpage控制項,先搭建出一個網站的基本架構架構。
在visual web developer 2005 beta 1中,建立一個網站,之後添加上文的web.sitemap檔案,再添加一個名叫Navigation的master類型的頁面,代碼如下:[被屏蔽廣告] 程式碼<%@ Master Language="C#" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Master Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table style="width: 100%; height: 100%" border="1">
<tr>
<td style="width: 10%">
<asp:TreeView ID="TreeView1" Runat="server" DataSourceID="SiteMapDataSource1"
ExpandDepth="2" ShowExpandCollapse="False" NodeIndent="10">
<LevelStyles>
<asp:TreeNodeStyle Font-Bold="True" Font-Underline="False"/>
<asp:TreeNodeStyle Font-Italic="True" Font-Underline="False" />
<asp:TreeNodeStyle Font-Size="X-Small" ImageUrl="bullet.gif" Font-Underline="False" />
</LevelStyles>
<NodeStyle ChildNodesPadding="10" />
</asp:TreeView>
</td>
<td style="width: 100px">
<asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
</asp:contentplaceholder>
</td>
</tr>
</table>
<asp:SiteMapDataSource ID="SiteMapDataSource1" Runat="server"/>
</div>
</form>
</body>
</html>
在上面的代碼中,其中的TREEVIEW控制項中的DATASORUCE屬性中,就指定了sitemapdatasource控制項,並且在treeview控制項中,也定義了不同結點的樣式。
在完成了masterpage頁面後,就等於已經把網站的模版頁建立起來了,接下來就可以建立其他子頁面,以繼承masterpage頁面,並且建立各自頁面的內容了。比如,建立一個default.aspx頁面,代碼如下:[被屏蔽廣告] 程式碼<%@ Page Language="C#" MasterPageFile="Navigation.master" Title="Default Page"%>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1"
ID="Content1" Runat="Server">
This is the default page
</asp:Content>
可以看到,當建立了模版頁後,就可以建立其他的子頁面了,只需要在其中的contentplaceholderid中寫入不同的內容就可以了。運行起來後,效果
接下來,我們來介紹如何將menu菜單控制項和sitemapdatasource 控制項配合使用。其中,我們在上面的例子的基礎上,在<table style="width: 100%; height: 100%" border="1">下面增加如下代碼就可以了,[被屏蔽廣告] 程式碼<tr height="100px">
<td colspan="2" align="left">
<asp:Menu ID="Menu1" Runat="Server"
DataSourceID="SiteMapDataSource1">
</asp:Menu>
</td>
</tr>
其中,我們增加了一個menu控制項,其中將其datasourceid屬性設定為sitemapdatasource1就可以了,運行如,當然,我們可以改變menu控制項的顯示位置,如可以將其改成垂直樣式顯示。
而對於我們經常見到的顯示出頁面當前路徑的導航條功能,在asp.net 2.0中也可以輕易實現,我們可以使用其中的sitemappath控制項。我們緊接著在上文代碼中的menu控制項下,增加如下代碼:程式碼:<tr height="100px">
<td colspan="2" align="left">
Currently Selected Page is:
<asp:SiteMapPath Runat="Server" ID="SiteMapPath1"></asp:SiteMapPath>
</td>
</tr>
要注意的是,只要增加sitemappath控制項就可以了,因為它會自動和已經增加的sitemapdatasource控制項進行綁定的。我們為了說明問題,另外增加一個頁面member.aspx,代碼如下:[被屏蔽廣告] 程式碼<%@ Page Language="C#" MasterPageFile="Navigation.master" Title="Members Page"%>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" ID="Content1" Runat="Server">
This is the members page
</asp:Content>
運行結果如下:
最後,我們看一下,如何通過編程的方式來擷取頁面導航中的相關資料。其中,必須引用到的是sitemap類,該類提供了很多相關的方法和屬性,最重要的是currentnode屬性,它可以指出目前使用者正在瀏覽的是哪一個欄目頁面,這用來跟蹤使用者在網站中的行動軌跡,並進行網站資料統計,有時是很有用的,舉例如下:[被屏蔽廣告] 程式碼<%@ Page Language="C#" MasterPageFile="Navigation.master" Title="Members Page"%>
<script runat="Server">
void Page_Load(object sender, EventArgs e)
{
Response.Write("The currently selected root node is: " + SiteMap.CurrentNode.Description + "<br>");
Response.Write("The Parent for the currently selected node is : " +
SiteMap.CurrentNode.ParentNode.Description);
}
</script>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" ID="Content1" Runat="Server">
This is the members page
</asp:Content>
在這個例子中,使用程式的方式,得出了使用者當前正在瀏覽的欄目頁面,以及該欄目的父欄目的名稱,運行結果如:
可以看出,在asp.net 2.0中,實現頁面導航的功能十分靈活而且方便,功能十分強大,更多的功能請參考MSDN。
SiteMapDataSource 類
注意:此類在 .NET Framework 2.0 版中是新增的。
提供了一個資料來源控制項,Web 伺服器控制項及其他控制項可使用該控制項綁定到分層的網站地圖資料。
SiteMapDataSource 控制項是網站地圖資料的資料來源,網站資料則由為網站配置的網站地圖提供者進行儲存。SiteMapDataSource 使那些並非專門作為網站導覽控制項的 Web 伺服器控制項(如 TreeView、Menu 和 DropDownList 控制項)能夠綁定到分層的網站地圖資料。可以使用這些 Web 伺服器控制項將網站地圖顯示一個為目錄,或者對網站進行主動式導航。當然,您也可以使用 SiteMapPath 控制項,該控制項被專門設計為一個網站導覽控制項,因此不需要 SiteMapDataSource 控制項的執行個體。
SiteMapDataSource 綁定到網站地圖資料, 並基於在網站地圖階層中指定的起始節點顯示其視圖。預設情況下,起始節點是階層的根節點,但也可以是階層中的任何其他節點。起始節點由以下幾個 SiteMapDataSource 屬性的值來標識:
起始節點
屬性值
階層的根節點(預設設定)。
StartFromCurrentNode 為 false。
未設定 StartingNodeUrl。
表示當前正在查看的頁的節點。
StartFromCurrentNode 為 true。
未設定 StartingNodeUrl。
階層的特定節點。
StartFromCurrentNode 為 false。
已設定 StartingNodeUrl。
如果 StartingNodeOffset 屬性設定為非 0 的值,則它會影響起始節點以及由 SiteMapDataSource 控制項基於該節點公開的網站地圖資料層次結構。StartingNodeOffset 的值為一個負整數或正整數,該值標識從 StartFromCurrentNode 和 StartingNodeUrl 屬性所標識的起始節點沿網站地圖階層上移或下移的層級數,以便對資料來源控制項公開的子樹的起始節點進行位移。
如果 StartingNodeOffset 屬性設定為負數 -n,則由該資料來源控制項公開的子樹的起始節點是所標識的起始節點上方 n 個層級的上級節點。如果 n 的值大於階層樹中所標識起始節點上方的所有上級層級數,則子樹的起始節點是網站地圖階層的根節點。
如果 StartingNodeOffset 屬性設定為正數 +n,則公開的子樹的起始節點是位於所標識的起始節點下方 n 個層級的子節點。由於階層中可能存在多個子節點的分支,因此,如果可能,SiteMapDataSource 會嘗試根據所標識起始節點與表示當前被請求頁的節點之間的路徑,直接解析子節點。如果表示當前被請求頁的節點不在所標識起始節點的子樹中,則忽略 StartingNodeOffset 屬性的值。如果表示當前被請求頁的節點與位於其上方的所標識起始節點之間的層級差距小於 n 個層級,則使用當前被請求頁作為起始節點。
網站地圖資料是從 SiteMapProvider 對象(如作為 ASP.NET 的預設網站地圖提供者的 XmlSiteMapProvider)中檢索的。可指定為網站配置的任何提供者向 SiteMapDataSource 提供網站地圖資料,並且通過訪問 SiteMap.Providers 集合可獲得可用提供者的列表。
與所有資料來源控制項一樣,SiteMapDataSource 的每個執行個體都與單個協助器對象關聯,該協助器對象稱為資料來源檢視。SiteMapDataSourceView 是一個基於網站地圖資料的視圖,根據資料來源的屬性進行設定,並且通過調用 GetHierarchicalView 方法來檢索此視圖。SiteMapDataSourceView 維護控制項所綁定到的 SiteMapNodeCollection 對象。
預設情況下,起始節點是階層的根節點,但是您可將起始節點設定為任何節點。起始節點可以是相對於網站地圖中當前位置的一個節點,或者是相對於某個絕對位置的節點。通過設定 StartingNodeUrl 屬性可指定起始節點。
SiteMapDataSource 專用於導航資料,並且不支援排序、篩選、分頁或緩衝之類的常規資料來源操作,也不支援更新、插入或刪除之類的資料記錄操作。
樣本
下面的程式碼範例示範如何以聲明方式使用 SiteMapDataSource 控制項將 TreeView 控制項綁定到一個網站地圖。該網站地圖資料從根節點層級開始檢索。
C#
程式碼<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<BODY>
<FORM runat="server">
<asp:SiteMapDataSource
id="SiteMapDataSource1"
runat="server" />
<asp:TreeView
id="TreeView1"
runat="server"
DataSourceID="SiteMapDataSource1">
</asp:TreeView>
</FORM>
</BODY>
</HTML>
Visual Basic
程式碼<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<BODY>
<FORM runat="server">
<asp:SiteMapDataSource
id="SiteMapDataSource1"
runat="server" />
<asp:TreeView
id="TreeView1"
runat="server"
DataSourceID="SiteMapDataSource1">
</asp:TreeView>
</FORM>
</BODY>
</HTML>J# 程式碼<%@ Page Language="VJ#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<BODY>
<FORM runat="server">
<asp:SiteMapDataSource
id="SiteMapDataSource1"
runat="server">
</asp:SiteMapDataSource>
<asp:TreeView
id="TreeView1"
runat="server"
DataSourceID="SiteMapDataSource1">
</asp:TreeView>
</FORM>
</BODY>
</HTML>
原文出處:http://www.ad0.cn/netfetch/article.asp?id=285