在ASP.NET 2.0中使用頁面導航控件

　　幾乎每個網站裡為了方便用戶在網站中進行頁面導航都少不了使用頁面導航控件有了頁面導航的功能用戶可以很方便地在一個復雜的網站中進行頁面之間的跳轉在以往的WEB編程中要寫一個好的頁面導航功能並不是那麼容易的也要使用一些技巧而在中為了方便進行頁面導航新增了一個叫做頁面導航控件sitemapdatasource其中還可以綁定到不同的其他頁面控件比如treeviewmenu等十分靈活使到能很方便地實現頁面導航的不同形式而且還提供了運行時的編程接口可以以編程的形式動態實現頁面導航控件本文將簡單以幾個例子來介紹一下在中如何實現頁面導航
　　
　　頁面導航的結構和sitemapdatasource控件
　　
　　在中要實現頁面導航應該先以xml的形式提供出整個網站的頁面結構層次我們可以編寫一個叫websitemap的XML文本文件在該文件中定義出整個要導航頁面的結構層次舉例如下
　　
　　<?xml version= encoding=utf ?>
　　
　　<siteMap>
　　
　　<siteMapNode title=Default description=Home url=Defaultaspx >
　　
　　<siteMapNode title=Members description=Members url=Membersaspx>
　　
　　<siteMapNode title=My Account description=My Account url=MyAccountaspx />
　　
　　<siteMapNode title=Products description=Products url=Productsaspx />
　　
　　</siteMapNode>
　　
　　<siteMapNode title=Administration description=Administration url=~/Admin/Defaultaspx>
　　
　　<siteMapNode title=Customer description=Customer Admin url=~/Admin/Customer/defaultaspx />
　　
　　<siteMapNode title=Products Admin description=Products Admin url=~/Admin/ProductsAdminaspx />
　　
　　</siteMapNode>
　　
　　</siteMapNode>
　　
　　</siteMap>
　　
　　我們可以看到其中websitemap文件必須包含根結點sitemap而且設置一個父sitemapnode結點該結點表明是默認的站點首頁在該父sitemapnode結點下可以有若干個子sitemapnode結點分別按層次結構代表了網站的各子欄目(留意一下上例中各個子結點之間的包含關系)而每一個sitemapnode結點中有如下若干個屬性
　　
　　)URL屬性該屬性指出要導航的欄目的地址鏈接在websitemap中定義中必須是每個欄目的相對地址
　　
　　)Title屬性該屬性指出每個子欄目的名稱顯示在頁面中
　　
　　)Description屬性該屬性指定時則用戶在鼠標移動到該欄目時出現有關該欄目的相關提示類似於tooltips屬性
　　
　　在設計好sitemap屬性後接下來就可以一步步構建頁面導航功能了主要有兩個步驟
　　
　　) 向頁面中添加sitemapdatasource控件該控件會自動感應綁定websitemap中的內容
　　
　　) 將sitemapdatasource控件綁定到如sitemappathtreeviewmenu等控件中也就是說將它們的數據源設置為該sitemapdatasource控件
　　
　　知道了方法後我們下面就分別以treeviewmenusitemappath三種控件為例子介紹一下如何和sitemapdatasource控件進行配合使用
　　
　　先來介紹使用treeview控件和sitemapdatasource 控件配合使用的方法Treeview樹形列表控件十分適合於用來做頁面導航為了能具體說明我們充分利用中的masterpage控件先搭建出一個網站的基本框架架構
　　
　　在visual web developer beta 中新建一個網站之後添加上文的websitemap文件再添加一個名叫Navigation的master類型的頁面代碼如下
　　
　　<%@ Master Language=C# %>
　　
　　<html xmlns=//xhtml >
　　
　　<head id=Head runat=server>
　　
　　<title>Master Page</title>
　　
　　</head>
　　
　　<body>
　　
　　<form id=form runat=server>
　　
　　<div>
　　
　　<table border=>
　　
　　<tr>
　　
　　<td >
　　
　　<asp:TreeView ID=TreeView Runat=server DataSourceID=SiteMapDataSource
　　
　　ExpandDepth= ShowExpandCollapse=False NodeIndent=>
　　
　　<LevelStyles>
　　
　　<asp:TreeNodeStyle FontBold=True FontUnderline=False/>
　　
　　<asp:TreeNodeStyle FontItalic=True FontUnderline=False />
　　
　　<asp:TreeNodeStyle FontSize=XSmall ImageUrl=bulletgif FontUnderline=False />
　　
　　</LevelStyles>
　　
　　<NodeStyle ChildNodesPadding= />
　　
　　</asp:TreeView>
　　
　　</td>
　　
　　<td >
　　
　　<asp:contentplaceholder id=ContentPlaceHolder　runat=server>
　　
　　</asp:contentplaceholder>
　　
　　</td>
　　
　　</tr>
　　
　　</table>
　　
　　<asp:SiteMapDataSource ID=SiteMapDataSource Runat=server/>
　　
　　</div>
　　
　　</form>
　　
　　</body>
　　
　　</html>
　　
　　在上面的代碼中其中的TREEVIEW控件中的DATASORUCE屬性中就指定了sitemapdatasource控件並且在treeview控件中也定義了不同結點的樣式
　　
　　在完成了masterpage頁面後就等於已經把網站的模版頁建立起來了接下來就可以新建其他子頁面以繼承masterpage頁面並且新建各自頁面的內容了比如新建一個defaultaspx頁面代碼如下
　　
　　<%@ Page Language=C# MasterPageFile=Navigationmaster Title=Default Page%>
　　
　　<asp:Content ContentPlaceHolderID=ContentPlaceHolder
　　
　　ID=Content Runat=Server>
　　
　　This is the default page
　　
　　</asp:Content>
　　
　　可以看到當建立了模版頁後就可以新建其他的子頁面了只需要在其中的contentplaceholderid中寫入不同的內容就可以了運行起來後效果如圖
　　　

educitycn/img_///jpg >
　　接下來我們來介紹如何將menu菜單控件和sitemapdatasource 控件配合使用其中我們在上面的例子的基礎上在<table border=>下面增加如下代碼就可以了
　　
　　<tr height=px>
　　
　　<td colspan= align=left>
　　
　　<asp:Menu ID=Menu Runat=Server
　　
　　DataSourceID=SiteMapDataSource>
　　
　　</asp:Menu>
　　
　　</td>
　　
　　</tr>
　　
　　其中我們增加了一個menu控件其中將其datasourceid屬性設定為sitemapdatasource就可以了運行如下圖當然我們可以改變menu控件的顯示位置如可以將其改成垂直樣式顯示
　　　

educitycn/img_///jpg >
　　而對於我們經常見到的顯示出頁面當前路徑的導航條功能在中也可以輕易實現我們可以使用其中的sitemappath控件我們緊接著在上文代碼中的menu控件下增加如下代碼
　　
　　<tr height=px>
　　
　　<td colspan= align=left>
　　
　　Currently Selected Page is:
　　
　　<asp:SiteMapPath Runat=Server ID=SiteMapPath></asp:SiteMapPath>
　　
　　</td>
　　
　　</tr>
　　
　　要注意的是只要增加sitemappath控件就可以了因為它會自動和已經增加的sitemapdatasource控件進行綁定的我們為了說明問題另外增加一個頁面memberaspx代碼如下
　　
　　<%@ Page Language=C# MasterPageFile=Navigationmaster Title=Members Page%>
　　
　　<asp:Content ContentPlaceHolderID=ContentPlaceHolder ID=Content Runat=Server>
　　
　　This is the members page
　　
　　</asp:Content>
　　
　　運行結果如下
　　　

educitycn/img_///jpg >
　　最後我們看一下如何通過編程的方式來獲取頁面導航中的相關數據其中必須引用到的是sitemap類該類提供了很多相關的方法和屬性最重要的是currentnode屬性它可以指出當前用戶正在浏覽的是哪一個欄目頁面這用來跟蹤用戶在網站中的行動軌跡並進行站點數據統計有時是很有用的舉例如下
　　
　　<%@ Page Language=C# MasterPageFile=Navigationmaster Title=Members Page%>
　　
　　<script runat=Server>
　　
　　void Page_Load(object sender EventArgs e)
　　
　　{
　　
　　ResponseWrite(The currently selected root node is: + SiteMapCurrentNodeDescription + <br>);
　　
　　ResponseWrite(The Parent for the currently selected node is : +
　　
　　SiteMa
From:http://tw.wingwit.com/Article/program/net/201311/12540.html