Microsoft.NET

……………………………………………….Expertise in .NET Technologies

Web Site Navigation: Introduction – Part 1

Posted by Ravi Varma Thumati on February 2, 2012

One of the major issues facing Web site users is figuring out how to get around the site effectively.

Web sites are often hierarchical in nature, and pages are sometimes nested several layers deep. Users may often fi nd themselves asking questions like “Where am I now?” and “Where can I go from here?” This chapter covers ASP.NET’s support for addressing the issue of Web site navigation.

The art of Web site design has progressed far enough that some common navigation idioms are beginning to appear ubiquitously. If you browse a few Web sites hosted on various platforms, you’ll notice that the sites support a number of different ways to navigate their content. For example, many Web sites include a menu bar across the top of the page with links to separate areas on the site. Certain sites include some sort of tree structure to navigate the site. Still others include a “breadcrumb” trail showing you where you are and how to get back. ASP.NET supports all these idioms.

Site Navigation in ASP.NET 1.x

ASP.NET version 1.x did not provide any built-in site navigation support; therefore, most developers implemented their own site navigation functionality. In creating their own site navigation functionality, developers were faced with two challenges:

  1. Decide how to serialize the site’s structure information into a site map, and
  2. Implement the navigation user interface elements

For the first challenge, developers needed to decide how to model the site’s structure. Would they put the information in an XML file? Would they add a database table that had the various sections of the site and how they were related? For sites that supported user accounts, there might be portions of the site that were only accessible to users who belonged to a particular role. Furthermore, multilingual sites needed to somehow provide translations for the various site sections.

After deciding what information needed to be saved to represent the site’s structure, along with how this information was going to be serialized (database? XML file? something else?), a developer was still faced with a second challenge – how to show this site structure to the user. A common navigation user interface element in the menu; however, ASP.NET 1.x doesn’t ship with a built-in Menu Web control, meaning developers were faced with the buy or build delimma.

For more information on using a menu in an ASP.NET 1.x application, try the below link:

Using Menus in an ASP.NET 1.x Web Application

To sum things up, implementing site navigation in ASP.NET version 1.x was not a tremendously difficult task, but it was another task that had to be done. Furthermore, since there was no built-in support for site navigation, each developer likely came up with his own unique approach, steepening the learning curve for developers new to a project who have to learn the custom site navigation logic.

Site Navigation in ASP.NET 2.0

Implementing site navigation in ASP.NET 2.0 is a breeze, thanks to the building site navigation features. Internally, ASP.NET offers a programmatic API that enables the site map to be queried. ASP.NET does not require a particular format for specifying the site map, although it does provide a default choice that uses an XML-formatted file. The details on how the site map is seralized can be customized because the site navigation feature of ASP.NET 2.0 uses the provider model.

In short, you can use ASP.NET 2.0’s default XML-based method for specifying your website’s site map or, with a bit of code, you can use your existing, custom method, or some other approach. (This article will examine using the default technique (the XML-based site map); a future article in this series will look at how to customize the site navigation provider.)

To create a consistent, easily managed navigation solution for your site, you can use ASP.NET site navigation. ASP.NET site navigation offers the following features:

  • Site maps – we can use a site map to describe the logical structure of your site. You can then manage page navigation by modifying the site map as pages are added or removed, instead of modifying hyperlinks in all of your Web pages.
  • ASP.NET controls – we can use ASP.NET controls to display navigation menus on your Web pages. The navigation menus are based on the site map.
  • Programmatic control – we can work with ASP.NET site navigation in code to create custom navigation controls or to modify the location of information that is displayed in a navigation menu.
  • Access rules – we can configure access rules that display or hide a link in your navigation menu.
  • Custom site-map providers – we can create custom site-map providers that allow you to work with your own site-map back end (for example, a database where you store link information) and plug your provider into the ASP.NET site-navigation system.

ASP.NET’s Navigation Support

ASP.NET’s navigation support comes in three parts: the navigation controls, the site map data source, and the site map provider architecture. The navigation controls (the Menu, the TreeView, and the SiteMapPath) all have the capability to resolve human-readable display names to real URLs to which HTTP requests may be sent. The site map data source stores information about a site’s hierarchical organization. The site map provider interprets physical data (often in the form of an XML fi le) and implements a kind of database cursor representing the current position within a site’s hierarchy.

The Navigation Controls

ASP.NET includes three server-side controls devoted specifi cally to site navigation—the SiteMapPath, the Menu, and the TreeView control. The Menu and the TreeView both maintain collections of display name/URL mappings. These collections may be edited by hand. In addition, these controls can build hierarchical collections of display name/URL mappings based on information in a site map data source. The SiteMapPath builds its collection of display name/URL mappings solely through a site map data source.

Table summarizes the ASP.NET navigation controls.

Navigation Control Description
Menu Interprets the site navigational information contained in the sitemap XML file and presents it in a menu format. Top level XML nodes become top level menu items, with child XML nodes becoming child menu items.
TreeView Interprets the site navigational information contained in the sitemap XML file and presents it in a tree format. The top level sitemap XML nodes in this case become higher-level branches in the tree, with child nodes represented as child tree nodes.
SiteMapPath Interprets the site navigational information contained in the sitemap XMLfi le and presents it in a “breadcrumb” format. In this case, only the current

XML node’s path is displayed (from the root node to the current child node).

All three controls are useful for navigation, but the Menu and the TreeView are useful outside the context of site navigation. SiteMapPath is designed strictly for navigating the Web site’s sitemap XML fi le. The Menu control displays items hierarchically and fires events back to the server as the items are selected. The items in the Menu control may also be assigned navigation URLs. The TreeView is useful for displaying any hierarchical data source that implements either the IHierarchicalDataSource or the IHierarchicalEnumerable interface, and it also has the capability to cause redirects to other URLs (that is, it’s useful for site navigation). And, as I mentioned, the SiteMapPath is meant specifically to be used for Web site navigation.

Background

When you organize your site and determine the layout of your pages, it’s easy to formalize the layout with a master page that includes a menu linking to other pages (just as in the master page chapter). The work involves creating the menu and adding the links (through the NavigateUrl property of the menu item). Implementing the navigation infrastructure by hand is easy enough the first time around. However, as your site grows and becomes more complex, having to update the navigation support repeatedly becomes a problem.

Solution

The main advantage of using ASP.NET’s navigation support is that you can establish the layout of the site and then represent it using a hierarchical data structure (like an XML file or even a database table). The Menu, TreeView, and SiteMapPath controls may all point to a site map data source and use the data source to populate themselves. When you plug the site map data source into the navigation controls, the navigation controls use the data source to create the individual links.

After the site map has been established, updating the navigation links simply requires updating the site map. All controls using the site map data source will reflect the change automatically.

XML Site Maps

ASP.NET includes built-in support for navigation via XML fi les that describe the layout of the site. These are called XML site maps. ASP.NET’s default site map support consists of an XML fi le describing the site layout and the SiteMapProvider that reads the XML fi le and generates SiteMap nodes to whatever components are listening (for example, a Menu or a TreeView control).

The SiteMapProvider

The SiteMapProvider establishes the base class used by the navigation controls. ASP.NET’s default implementation is the XmlSiteMapProvider, which reads the XML fi le named (by default) web.sitemap.

While the default XML site map generally works very well, the ASP.NET navigation controls are perfectly happy using data sources generated from other places (rather than the XML data source). For example, you might decide to implement your own site map provider based on data in a database. The XML site map provides basic raw functionality for navigating a site. However, if you want to do something like manage the site map using a schema different from the default XML schema that calls for designing a custom provider.

The SiteMap Class

The main rendezvous point for the ASP.NET navigation infrastructure is the SiteMap class. To support the navigation infrastructure, the SiteMap class has a set of static methods for managing site navigation. The SiteMap class serves as an in-memory representation of the navigation structure for a site, and its functionality is implemented by one or more site map providers. It’s an abstract class so it must be inherited.

The SiteMap class performs several functions. First, it serves as the root node of the site navigation hierarchy. Second, it establishes the principal site map provider. Finally, it keeps track of all the provider objects that comprise the site map. The SiteMap contains a hierarchical collection of SiteMapNode objects. Regardless of how the site map data are maintained, the SiteMap is the interface for accessing a site’s navigation information.

The ASP.NET default configuration specifies a default site map. However, as with all things configurable in ASP.NET, you may easily override the default configuration to establish a different provider.

The SiteMap class offers only static members. By being static, they enhance performance. In addition, the site map functionality may be accessed at any time in a Web application from a page or even from within a server-side control.

SiteMap Events and Properties

Name Type Description
SiteMapResolve Event The SiteMapResolve event fires when the CurrentNode property is accessed. This enables you to implement custom logic when creating a SiteMapNode representation of the currently executing page without requiring a custom provider implementation.
CurrentNode Property A SiteMapNode instance that represents the currently requested page in the navigational hierarchy. If there is no node in the XML site map fi le, the returned value will be null.
Enabled Property Returns a Boolean value indicating if a site map provider is both specified and enabled in the web.config file.
Provider Property Returns the default SiteMapProvider for the current site map.
Providers Property Returns a read-only collection of named SiteMapProvider objects that are available to the SiteMap class as specified in the web.config file (since you can specify more than one if you wish). Note that only the default provider is used during initialization, however.
RootNode Property Returns the SiteMapNode that represents the top-level page of the navigation hierarchy for the site.

The SiteMapNode

The SiteMapNodes themselves represent the hierarchical elements of the site map, which is to say, each instance of a SiteMapNode represents a page in your Web site. Each node represents an individual page that is located somewhere in the overall Web site navigation hierarchy. When a Web application starts, the SiteMap loads the collection of SiteMapNodes based on the providers that have been configured in your web.config file for that site.

The SiteMapNode includes several useful properties: ChildNodes, Description, HasChildNodes, Key, NextSibling, ParentNode, PreviousSibling, Provider, ReadOnly, ResourceKey, Roles, RootNode, Title, and Url. It also includes several useful methods: GetAllNodes, GetDataSourceView, GetHierarchicalDataSourceView, IsAccessibleToUsers, and IsDescendentOf. We’ll see some of these properties being used in later examples. For instance, we’ll use many of these properties in the example for this chapter when we handle the SiteMapResolve event and modify the navigation functionality on the fly.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: