TRƯỜNG ĐẠI HỌC KHOA HỌC TỰ NHIÊN
KHOA CÔNG NGHỆ THÔNG TIN
BỘ MƠN CƠNG NGHỆ PHẦN MỀM
------
ASP.NET Navigation
Mơn học: Lập trình ASP.NET
1
Nội dung
2
ASP.NET Navigation
XML Site map
SiteMapPath control
Menu control
Treeview control
Một số mở rộng đối với Sitemap
ASP.NET Navigation
3
Khi xây dựng website, một vấn đề quan trọng cần
quan tâm là việc xây dựng cấu trúc của Website
(organization structure)
Khái niệm organization structure thường được gọi
là sitemap
XML Site map
4
Site Navigation
5
ASP.NET hỗ trợ cơ chế Site Navigation thông qua:
Các Sitemap control dùng để hiển thị site map
SitemapPath control
Menu control
Treeview control
Một cơ chế cho phép lưu trữ các liên kết của tất cả các
web page tại một nơi tập trung và thể hiện các liên kết
này dựa trên các Sitemap control
Site Navigation Schema
Controls
Menu
Menu
TreeView
TreeView
SiteMapSiteMapDataSource
DataSource
Site Navigation API
SiteMap
SiteMap
SiteMapNode
SiteMapNode SiteMapNode
SiteMapNode SiteMapNode
SiteMapNode
Providers
XmlSiteMapProvider
XmlSiteMapProvider
Other
OtherSite
SiteMap
Map
Providers
Providers
Web.sitemap
Other
Data Stores
Site Maps
SiteMapPath
SiteMapPath
XML Site map
7
Để sử dụng các ASP.NET Site map control, cần
định nghĩa cấu trúc website thông qua các external
data source.
Các external data source dùng cho thao tác
mapping này có thể là các XML file, database…
XML Site map
8
Mặc định thì ASP.NET 2.0 sử dụng
XmlSiteMapProvider
Sử dụng Web.sitemap (XML file) chứa thông tin về cấu trúc
của website
Các Sitemap control sử dụng file Web.sitemap lấy thông tin
cấu trúc Website và hiển thị dưới dạng menu, treeview hoặc
sitemapPath
Web.sitemap
9
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns=" >
<siteMapNode url="" title="" description="">
<siteMapNode url="~/Default.aspx" title="Trang Chủ" description="Trang Chủ" >
</siteMapNode>
description="ShoppingCartAdmin" />
description="OrdersAdmin" />
<siteMapNode url="~/Gallery.aspx" title="Gallery" description="Gallery" />
<siteMapNode url="~/ContactUs.aspx" title="Liên hệ" description="Liên hệ" />
</siteMapNode>
</siteMap>
Sử dụng XML Site Map
10
Tạo SiteMapDataSource
<asp:SiteMapDataSource ID="SiteSource" runat="server" />
Web.Sitemap
Cấu hình SiteMap File
11
Cấu hình thay đổi file sitemap trong Web.Config
<configuration>
<system.web>
enabled="true">
type="System.Web.XmlSiteMapProvider"
siteMapFile="~/Special.Sitemap"/>
type="System.Web.XmlSiteMapProvider"
siteMapFile="~/web.Sitemap"/>
</providers>
</siteMap>
</system.web>
</configuration>
SiteMapPath Control
12
Hiển thị đường dẫn truy cập từ root node (trang
chủ) đến node hiện tại (breadcrumb)
Mỗi node phân cách nhau bởi PathSeperator
Stylizing SiteMapPath
<asp:SiteMapPath Font-Name="Verdana" Font-Size="10pt" RunAt="server">
<CurrentNodeStyle Height="24px" BackColor="Yellow" Font-Bold="true" />
<NodeStyle Height="24px" />
<PathSeparatorTemplate>
<ItemTemplate>
<asp:Image ImageUrl="~/images/arrow.gif" RunAt="server" />
</ItemTemplate>
</PathSeparatorTemplate>
</asp:SiteMapPath>
Key SiteMapPath Properties
Name
CurrentNodeStyle
Description
Style used to render the current node
CurrentNodeTemplate HTML template used to render the current node
NodeStyle
Style used to render non-current nodes
NodeStyleTemplate
HTML template used to render non-current nodes
PathSeparator
Text used for node separators (default = ">")
PathSeparatorStyle
Style used to render node separators
PathSeparatorTemplate HTML template used to render node separators
Menu Control
15
Hiển thị cấu trúc website dưới dạng Menu
</asp:Menu>
Orientation=“Vertical"
StaticDisplayLevels="2"
StaticSubMenuIndent="0px
"
Orientation="Horizontal"
StaticDisplayLevels="2"
StaticSubMenuIndent="10p
x
TreeView Control
16
Hiển thị cấu trúc website dưới dạng TreeView
DataSourceID="SiteSource”>
</asp:TreeView>
ImageSet=“BulletedList6"
ImageSet=“Arrows"
ImageSet="WindowsHelp"
Declaring a TreeView
<asp:TreeView RunAt="server>
<Nodes>
<asp:TreeNode Text="Training" RunAt="server">
Navigateurl="Classes.aspx?id=1" />
NavigateUrl="Classes.aspx?id=2" />
NavigateUrl="Classes.aspx?id=3" />
</asp:TreeNode>
NavigateUrl="Consulting.aspx" />
NavigateUrl="Debugging.aspx" />
</Nodes>
</asp:TreeView>
Key TreeView Properties
Name
ExpandDepth
Description
Specifies the TreeView's initial expand depth
ShowExpandCollapse Specifies whether expand/collapse indicators are shown
LevelStyles
Specifies appearance of nodes by level
NodeStyle
Specifies default appearance of nodes
RootNodeStyle
Specifies appearance of root nodes
LeafNodeStyle
Specifies appearance of leaf nodes
SelectedNodeStyle
Specifies appearance of selected nodes
HoverNodeStyle
Specifies appearance of nodes when cursor hovers overhead
TreeViews and Site Maps
<asp:SiteMapDataSource ID="SiteMap" RunAt="server" />
<asp:TreeView DataSourceID="SiteMap" RunAt="server" />
Web.sitemap
<siteMap>
<siteMapNode title="Home" description="" url="default.aspx">
description="Training for .NET developers">
description="All about the .NET Framework" />
description="All about ASP.NET" />
description="All about Web services" />
</siteMapNode>
</siteMap>
Nội dung
20
ASP.NET Navigation
XML Site map
SiteMapPath control
Menu control
Treeview control
Một số mở rộng đối với Sitemap
Thay đổi Default sitemap file
Web.config
<configuration>
<system.web>
<siteMap>
<remove name="AspNetXmlSiteMapProvider" />
type="System.Web.XmlSiteMapProvider, System.Web, ..."
siteMapFile="Acme.sitemap" />
</providers>
</siteMap>
</system.web>
</configuration>
Security Trimming
Visible to everyone
<siteMap>
<siteMapNode title="Home" description="" url="default.aspx">
description="Information for all employees" roles="*" />
description="Salary data" roles="Managers,CEOs" />
<siteMapNode>
</siteMap>
Visible only to Managers
and CEOs
Enabling Security Trimming
<configuration>
<system.web>
<siteMap>
<remove name="AspNetXmlSiteMapProvider" />
type="System.Web.XmlSiteMapProvider, System.Web, ..."
securityTrimmingEnabled="true"
siteMapFile="web.sitemap" />
</providers>
</siteMap>
</system.web>
</configuration>
Sử dụng đối tượng Sitemap
// Write the title of the current node to a Label control
Label1.Text = SiteMap.CurrentNode.Title;
// Write the path to the current node to a Label control
SiteMapNode node = SiteMap.CurrentNode;
StringBuilder builder = new StringBuilder (node.Title);
while (node.ParentNode != null) {
node = node.ParentNode;
builder.Insert (0, " > ");
builder.Insert (0, node.Title);
}
Label1.Text = builder.ToString ();