How to Build Perfect and Best Navigation System in ASP for your Website

Welcome to TheCredence.com - You may like to subscribe to our RSS feed to stay updated.

Most sites consist of many web pages sometimes thousands. Going from one page to another is made possible due to some program logic. This programmed feature is called site navigation. The simplest model of site navigation is redirecting from one page to another by invoking code function or just clicking on a link with ‘href’ set property. To make the navigation possible more complex controls are involved. Some provide functionality without need of any code.

Although some controls are part of the navigation system and provide such functionality we will not discuss them at this article. Such controls are Multi view and wizard controls. Let’s pay attention to the site map model and menu controls which are rich navigation controls.

Site Map System

ASP.NET provides convenient way of implementing navigation into Web sites. There are tree procedures to complete and it’s ready to navigate.
- Create a site map file which by default is xml file with information about the site’s structure and urls.
- tune up the XMLSiteMapProvider and SiteMapDataSource in order to parse the data of the xml structure and supply the needed information.
- Integrate the information with the visual appearance of site and make possible interaction with users. This can be done by putting some controls bound to the provided information.

How to build Best Navigation System in ASP

Building the site map logic starts with creating the site map file.

1. Create new item: Web.sitemap. It has the fallowing xml format:

 
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
	<siteMapNode>
		<siteMapNode>...</siteMapNode>
		<siteMapNode>...</siteMapNode>
		...
	</siteMapNode>
</siteMap>

Note that the siteMap node should be followed by only one top siteMapNode. Nodes have these properties:
title="Title" description="Home" url="~/default.aspx"

Let we insert the following xml in our sitemap.

 
<?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">
        <siteMapNode url="~\Page1.aspx" title="Page1"  description="Page1" />
        <siteMapNode url="~\Page2.aspx" title="Page2"  description="Page2" />
    </siteMapNode>
</siteMap>

2. Now we are ready to add the SiteMapDataSource component from the toolbox.
3. Bind the data to a treeview control.

 
<asp:TreeView ID="TreeView1" runat="server"
            DataSourceID="SiteMapDataSource1"
	Width="100%" Height="100%">
</asp:TreeView>

It is a good idea to provide the site with a master page so a filed in the left to be remained for the navigation control. So there will be a navigation control placed next to every navigated page.
Navigation also can be made true code via the SiteMap object.

 
protected void Page_Load(object sender, EventArgs e)
{
	if (SiteMap.CurrentNode.NextSibling != null)
	{
		lnkNext.NavigateUrl = SiteMap.CurrentNode.NextSibling.Url;
		lnkNext.Visible = true;
	}
	else
	{
		lnkNext.Visible = false;
	}
}

Binding can be done with other controls too. For example bind to datagridview control and template it’s columns to contain a link to the url member of data source.

ASP.NET does not limit the site map model to above examples. You can build your custom SiteMapProvider and use for example SQL data source with different fields in it.