Latest web development tutorials

ASP.NET navigation

ASP.NET with built-in navigation controls.


Site Navigation

Maintenance of large sites is difficult and time-consuming menu.

In ASP.NET, the menu can be stored in a file, so easy to maintain. File typically namedweb.sitemap, and is stored in the root directory of your site.

In addition, ASP.NET has three core navigation controls:

  • Dynamic menus
  • TreeViews
  • Site Map Path

Sitemap file

In this tutorial, we use the following sitemap file:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<siteMap>
<siteMapNode title="Home" url="/aspnet/w3home.aspx">
<siteMapNode title="Services" url="/aspnet/w3services.aspx">
<siteMapNode title="Training" url="/aspnet/w3training.aspx"/>
<siteMapNode title="Support" url="/aspnet/w3support.aspx"/>
</siteMapNode>
</siteMapNode>
</siteMap>

Create rules sitemap file:

  • XML document must contain about the content of <siteMap> tag
  • <SiteMap> tag can only have one <siteMapNode> child node ( "home" page)
  • Each <siteMapNode> can have multiple child nodes (web)
  • Each <siteMapNode> with property defines the page title and URL

lampNote: sitemap file must be located in the root directory of the site, URL attributes must be relative to the root directory.


Dynamic menu

<Asp: Menu> control displays a standard site navigation menu.

Code examples:

<asp:SiteMapDataSource id="nav1" runat="server" />

<form runat="server">
<asp:Menu runat="server" DataSourceId="nav1" />
</form>

In the above example<asp: Menu> control is a placeholder for a server created navigation menu.

Data source controlsDataSourceId attribute definition.id = "nav1" data source to connect to the<asp: SiteMapDataSource>control.

<asp: SiteMapDataSource> control automatically connects to the default sitemap file (web.sitemap).


TreeView

<Asp: TreeView> control displays a multi-level navigation menu.

This menu looks like a tree with branches that, by + or - sign to open or close.

Code examples:

<asp:SiteMapDataSource id="nav1" runat="server" />

<form runat="server">
<asp:TreeView runat="server" DataSourceId="nav1" />
</form>

In the above example<asp: TreeView> control is a placeholder for a server created navigation menu.

Data source controlsDataSourceId attribute definition.id = "nav1" data source to connect to the<asp: SiteMapDataSource>control.

<asp: SiteMapDataSource> control automatically connects to the default sitemap file (web.sitemap).


SiteMapPath

SiteMapPath control displays a pointer (navigation path) of the current page. The path appears to point to the parent page can click on the link.

With different controls TreeView and Menu, SiteMapPath controldoes not use the SiteMapDataSource.SiteMapPath control web.sitemap default file.

lamp Tip: If the SiteMapPath is not displayed correctly, most likely due to the presence of URL errors (printing error) web.sitemap file.

Code examples:

<form runat="server">
<asp:SiteMapPath runat="server" />
</form>

In the above example<asp: SiteMapPath> control is a placeholder for a server created navigation menu.