ASP.NET Navigation controls uses SiteMapPath control to retrieve the navigation information on the website. A SiteMap represent the relationship between the pages in an application. Site Maps Use the Provider Data model. This post explains about default XML Site Map provider, which enables you to store a Site Map in an XML file.
Site Map file contains <siteMpNode> elements. You declare a SiteMapPath control on page and it automatically uses the web.sitemap file located in the root directory.
When the ViewGallery.aspx page is viewed in the browser, the SiteMapPath control displays something like the following, with Home and PictureGallery Page rendered as hyperlinks:
Home > PictureGallery Page > ViewGallery
You can use the SiteMapPath control to create site navigation without code and without binding data. The control can read and render the site-map information automatically. However, if needed, you can also use the SiteMapPath control to alter site-map data. For more information, see How to: Programmatically Modify Site-Map Nodes in Memory.
<asp:SiteMapPath ID="SiteMapPathExample" Runat="server"></asp:SiteMapPath>
::Following are some important properties::
PathSeparator:- Gets or sets Path separator text.
NodeStyle:- Sets the style of all nodes that will be displayed.
CurrentNodeStyle:- Sets the style on node that represent the current page.
RootNodeStyle:- Sets the style on the absoulte root node.
PathSeparatorStyle:- Sets the style of path separator.
The SiteMapPath control enables users to navigate backward — from the current page to pages that are higher in the site hierarchy. However, the SiteMapPath control does not enable users to navigate forward — from the current page to another page that is lower in the site hierarchy. For example, you can use the SiteMapPath control in newsgroup or message board applications to enable users to see the path to the article that they are currently browsing.
<siteMap>
<siteMapNode title="Home" description="Home" url="~/default.aspx" >
<siteMapNode title="PictureGallery Page" description="PictureGallery Page we offer"
url="~/PictureGallery Page.aspx">
<siteMapNode title="ViewGallery" description="ViewGallery classes"
url="~/ViewGallery.aspx" />
<siteMapNode title="Description" description="Description PictureGallery Page"
url="~/Description.aspx" />
</siteMapNode>
</siteMapNode>
</siteMap>
ASP.NET provides a class called SiteMap that offers read-only, programmatic access to the site map. This class is used internally by the two controls we'll be examining in this article:
A.SiteMapPath - renders a breadcrumb based on the page being visited and it's position in the site structure. Specifically, the SiteMapPath starts from the node returned by the SiteMap.CurrentNode property and walks up the hierarchy until it reaches the root.
B.SiteMapDataSource - this control creates a hierarchical datasource that mirrors the structure of the site map. In order to display site map information in other Web controls, such as the TreeView or Menu, the Web controls don't query the site map directly; rather, they are bound to a SiteMapDataSource control, which handles reading in the site map structure.
The SiteMap class has two germane properties: RootNode and CurrentNode. Both of these properties return SiteMapNode instances. The SiteMapNode class represents a node defined in the site map and has properties describing the node - Title, Url, and Description - as well as properties that allow for programmatic movement through the hierarchy - ParentNode, ChildNodes, NextSibling, PreviousSibling, and so on.
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="Default.aspx" title="Home" description="Home Page">
<siteMapNode url="ExampleToolBox.aspx" title="Example ToolBox Control" description="Example ToolBox Control">
<siteMapNode url="ExampleBulletedList.aspx" title="BulltedList Example" description="BulltedList Control Simple Example" />
<siteMapNode url="ExampleCheckBox.aspx" title="ExampleCheckBox Example" description="ExampleCheckBox Control Simple Example" />
<siteMapNode url="ExampleCheckBoxList.aspx" title="ExampleCheckBoxList Example" description="ExampleCheckBoxList Control Simple Example" />
<siteMapNode url="ExampleImage.aspx" title="ExampleImage Control Example" description="ExampleImage Control Simple Example"/>
</siteMapNode>
<siteMapNode url="DataToolBox.aspx" title="Data ToolBox Control" description="Data ToolBox Control">
<siteMapNode url="SqlDataSource.aspx" title="SqlDataSource Example" description="SqlDataSource Simple Example" />
<siteMapNode url="XmlDataSource.aspx" title="XmlDataSource Example" description="XmlDataSource Simple Example" />
</siteMapNode>
</siteMapNode>
</siteMap>
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>SiteMapPath Control ASP.Net C# Example</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:SiteMapDataSource ID="SiteMapDataSourceExample" runat="server" />
<asp:SiteMapPath ID="SiteMapPathExample" runat="server"></asp:SiteMapPath>
<br /><br />
<asp:Image ID="ExampleImage1" runat="server" ImageUrl="~/ExampleImages/SeaBeach.jpg" Height="300" Width="400" />
</div>
</form>
</body>
</html>
Site Map file contains <siteMpNode> elements. You declare a SiteMapPath control on page and it automatically uses the web.sitemap file located in the root directory.
When the ViewGallery.aspx page is viewed in the browser, the SiteMapPath control displays something like the following, with Home and PictureGallery Page rendered as hyperlinks:
Home > PictureGallery Page > ViewGallery
You can use the SiteMapPath control to create site navigation without code and without binding data. The control can read and render the site-map information automatically. However, if needed, you can also use the SiteMapPath control to alter site-map data. For more information, see How to: Programmatically Modify Site-Map Nodes in Memory.
<asp:SiteMapPath ID="SiteMapPathExample" Runat="server"></asp:SiteMapPath>
::Following are some important properties::
PathSeparator:- Gets or sets Path separator text.
NodeStyle:- Sets the style of all nodes that will be displayed.
CurrentNodeStyle:- Sets the style on node that represent the current page.
RootNodeStyle:- Sets the style on the absoulte root node.
PathSeparatorStyle:- Sets the style of path separator.
The SiteMapPath control enables users to navigate backward — from the current page to pages that are higher in the site hierarchy. However, the SiteMapPath control does not enable users to navigate forward — from the current page to another page that is lower in the site hierarchy. For example, you can use the SiteMapPath control in newsgroup or message board applications to enable users to see the path to the article that they are currently browsing.
<siteMap>
<siteMapNode title="Home" description="Home" url="~/default.aspx" >
<siteMapNode title="PictureGallery Page" description="PictureGallery Page we offer"
url="~/PictureGallery Page.aspx">
<siteMapNode title="ViewGallery" description="ViewGallery classes"
url="~/ViewGallery.aspx" />
<siteMapNode title="Description" description="Description PictureGallery Page"
url="~/Description.aspx" />
</siteMapNode>
</siteMapNode>
</siteMap>
ASP.NET provides a class called SiteMap that offers read-only, programmatic access to the site map. This class is used internally by the two controls we'll be examining in this article:
A.SiteMapPath - renders a breadcrumb based on the page being visited and it's position in the site structure. Specifically, the SiteMapPath starts from the node returned by the SiteMap.CurrentNode property and walks up the hierarchy until it reaches the root.
B.SiteMapDataSource - this control creates a hierarchical datasource that mirrors the structure of the site map. In order to display site map information in other Web controls, such as the TreeView or Menu, the Web controls don't query the site map directly; rather, they are bound to a SiteMapDataSource control, which handles reading in the site map structure.
The SiteMap class has two germane properties: RootNode and CurrentNode. Both of these properties return SiteMapNode instances. The SiteMapNode class represents a node defined in the site map and has properties describing the node - Title, Url, and Description - as well as properties that allow for programmatic movement through the hierarchy - ParentNode, ChildNodes, NextSibling, PreviousSibling, and so on.
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="Default.aspx" title="Home" description="Home Page">
<siteMapNode url="ExampleToolBox.aspx" title="Example ToolBox Control" description="Example ToolBox Control">
<siteMapNode url="ExampleBulletedList.aspx" title="BulltedList Example" description="BulltedList Control Simple Example" />
<siteMapNode url="ExampleCheckBox.aspx" title="ExampleCheckBox Example" description="ExampleCheckBox Control Simple Example" />
<siteMapNode url="ExampleCheckBoxList.aspx" title="ExampleCheckBoxList Example" description="ExampleCheckBoxList Control Simple Example" />
<siteMapNode url="ExampleImage.aspx" title="ExampleImage Control Example" description="ExampleImage Control Simple Example"/>
</siteMapNode>
<siteMapNode url="DataToolBox.aspx" title="Data ToolBox Control" description="Data ToolBox Control">
<siteMapNode url="SqlDataSource.aspx" title="SqlDataSource Example" description="SqlDataSource Simple Example" />
<siteMapNode url="XmlDataSource.aspx" title="XmlDataSource Example" description="XmlDataSource Simple Example" />
</siteMapNode>
</siteMapNode>
</siteMap>
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>SiteMapPath Control ASP.Net C# Example</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:SiteMapDataSource ID="SiteMapDataSourceExample" runat="server" />
<asp:SiteMapPath ID="SiteMapPathExample" runat="server"></asp:SiteMapPath>
<br /><br />
<asp:Image ID="ExampleImage1" runat="server" ImageUrl="~/ExampleImages/SeaBeach.jpg" Height="300" Width="400" />
</div>
</form>
</body>
</html>