Create navigation for ASP. net2.0 site navigation

I. Introduction

A navigation user interface is required for any website composed of multiple pages. A navigation user interface may be as simple as a static hyperlink from some sites to some other pages, or may contain menus or tree controls. However, before creating a navigation user interface for the site, you must first define the logical structure of the site. (This logical structure is often referred to as a site map .) For example, a Website Like Amazon.com is organized into various parts, including product columns such as electronics books, computation books, and DVDs. Each part may also contain sub-parts. Bibliography is divided by type, such as CD, novels, historical books, and romantic books. Typically, these logical structures form a classification level. The following screen snapshot shows the scaled version of the site map of Amazon.com.

Once a site map is defined, you can create a navigation user interface for the site. On the Amazon.com site, the homepage lists the hyperlink of each part on the left side of the page. After entering a specific part, the child part information is displayed on the left. However, you can also use another navigation User Interface: You may have a tree to display each part and sub-part, or use a menu as a top menu item to list such as books, electronic products, DVD, and so on. The sub-menu of each menu item contains sub-parts of each part.

In ASP. before NET 2.0, developers typically implemented their own site navigation functions. however, Asp. NET 2.0 makes it easy to define the structure of a site and implement it using common navigation user interface elements. In this article, we will analyze the site navigation features of ASP. NET 2.0.

Ii. Site Navigation in ASP. NET 1. x

ASP. NET version 1.x does not provide any built-in site navigation support. Therefore, most developers implement their own site navigation functions. Developers face two challenges when creating their own site navigation functions:

1. decide how to serialize the site structure information to a site map

2. implement navigation user interface elements

To solve the first problem, developers need to determine how to model the structure of the site. What if I want to place the information in an XML file? Or should I add a database table to store all the parts of the site and their contact information? Websites that support user accounts may be accessible only to users with special roles. In addition, websites that support multiple languages must provide translation for each site to some extent.

Deciding what information needs to be stored to describe the structure of the site and how the information is serialized (database? XML file? Another thing ?) In the future, developers will face the second challenge-how to display the structure of the site to users. A commonly used navigation user interface element is a menu. However, the built-in menu web control is not provided in ASP. NET 1.x-this means that the developer has to pay for it or build it on his own.

To sum up, implementing site navigation in ASP. NET version 1.x is not a very difficult task. However, this is another task that must be done. Moreover, since there is no built-in support for site navigation, each developer may find his/her own unique method, which increases the steep learning curve for new developers-they must learn the custom site navigation logic.

3. Site Navigation in ASP. NET 2.0

It is easy to implement site navigation in ASP. NET 2.0, thanks to the construction of site navigation features. Internally, ASP. NET provides a set of programmable APIs that can be used to query site maps. ASP. NET does not need to provide a special format for the specified site map, although it does provide a default option to use XML format files. Details about how to serialize a site map can be customized, because the site navigation features of ASP. NET 2.0 use a provider model. This provider model allows developers to customize the internal implementation of a specific ASP. Net subsystem-as long as they keep the APIS referenced forward the same.

In short, you can use ASP. NET 2.0 default XML-based method to specify the site map of your website, or add only a bit of encoding, you can use the existing custom method, or some other methods. (This article will discuss the use of the default technology (based on XML and site map); the last article of this SystemArticleWill analyze how to customize the site navigation provider .)

In addition to providing a customizable method to specify the site structure, Asp. NET 2.0 released together with some navigation Web controls-they make site map display like dragging a control to your asp. NET page is as easy:

1. sitemappath-displays a breadcrumb, which is used to display the location of the end user relative to the site structure. For example, when accessing the novels part of the Amazon.com site, a breadcrumb may look like this: Home> books> novels.

2. Treeview-display the structure of the site with an expandable tree.

3. Menu-use a menu to display the structure of the site.

4. When the site navigation is displayed, both the Treeview control and Menu Control use the sitemapdatasource control to read the content of the site map.

At the underlying implementation level, these controls call the site navigation API of ASP. NET 2.0. Since the navigation part of the site is implemented using the provider model, it is easy to understand how the control serializes the internal implementation principle of the site map. That is to say, no matter whether you use the default site map or scroll your custom site map logic, navigation controls can work with your site map. (Assume that if you want to use a custom site map, you do need to create a class-it provides the desired method and attributes to work with the site map; for more detailed discussions, see the next article ).

4. Define a site map

A site map consists of a series of associated sitemapnode objects. These sitemapnodes are associated in a hierarchical manner (as described at the beginning of this article. This level contains a single root node-it is the only node in the layer without a parent node. Each node on this layer represents a logical part of the website. Each part has a title, URL, description, etc.-it is modeled using the attributes (title, URL, description, etc.) of the sitemapnodes class.

The layer of these sitemapnode objects shows how the site map is described in memory-when it is analyzed through the site navigation API of ASP. NET 2.0. However, this site map must be physically serialized in some way-for example, through an XML file or through a database table. By default, ASP. NET 2.0 uses an XML file to provide a default implementation to serialize the site map. To use this technology, you needProgramCreate an XML file under the root directory web. sitemap-it has the following structure:

<? XML version = "1.0" encoding = "UTF-8"?>
<Sitemap xmlns = "http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
<Sitemapnode attributes>
<Sitemapnode attributes>
<Sitemapnode attributes>
...
</Sitemapnode>
<Sitemapnode attributes/>
...
<Sitemapnode attributes/>
</Sitemapnode>
</Sitemap>
Tip: about creating a web. sitemap File

With Visual Studio 2005, you can easily create a map file for this site-by right-clicking the site in Solution Explorer and selecting "Add new item ", select the map icon of the site. Make sure the file name is Web. sitemap. The new file contains several <sitemapnode> XML elements-similar to the preceding XML fragments.

The <sitemapnode> element can have multiple attributes. The most common attributes are:

1. Title-specify the title of this section.

2. url-specify the URL of a part. This parameter is optional. However, if it is provided, each URL in the site map must be unique.

3. Description-optional description; used in the alt attribute of the generated navigation control.

The <sitemapnode> element can be nested to any depth. However, a site map must contain a <sitemapnode> element. That is to say, the <sitemap> node must have only one <sitemapnode> element subnode.

The following site map file shows the site structure of the Amazon.com sample in the simple section (according to the content provided at the end of this article, you can put this file and a complete ASP.. NET 2.0 website is loaded to your computer ).

<? XML version = "1.0" encoding = "UTF-8"?>
<Sitemap xmlns = "http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
<Sitemapnode url = "~ /Default. aspx "Title =" home ">
<Sitemapnode url = "~ /Books/default. aspx "Title =" books ">
<Sitemapnode url = "~ /Books/novels. aspx "Title =" Novels "/>
<Sitemapnode url = "~ /Books/history. aspx "Title =" History "/>
<Sitemapnode url = "~ /Books/romance. aspx "Title =" romance "/>
</Sitemapnode>
<Sitemapnode url = "~ /Electronics/default. aspx "Title =" electronics "/>
<Sitemapnode url = "~ /DVDs/default. aspx "Title =" DVDs "/>
<Sitemapnode url = "~ /Computers/default. aspx "Title =" computers "/>
</Sitemapnode>
</Sitemap>
5. Use the navigation web control to display the Site Map

Now that we have defined a site map, we will use an ASP. NET page to display the site map data. As mentioned above, there are three built-in navigation Web controls-sitemappath, Treeview, and menu. Using these controls is simple-you just need to drag them to the ASP. NET page and set properties to adjust the appearance of the controls to suit the needs of your site.

To this end, we will create a home page for the website. As discussed in a sneak peak at master pages in ASP. NET 2.0, the home page generally provides an easy way to define templates for the entire site range. Since the navigation user interface elements generally appear on every page of a site, the home page is often an ideal place to verify Web controls. Specifically, my homepage includes a table with the following three parts:

1. A header-the site title is displayed here ("Welcome to my website! ")

2. The left-side navigation pane is a Treeview control that lists the complete content of a site map. This allows visitors to quickly jump to a specific part of the site.

3. A main part-This part contains unique content relative to each page-they constitute the entire homepage (note that the contentplaceholder control in this part ). In addition, a control sitemappath is included at the top of this section, which is used to provide users with a breadcrumb to instruct them where they are currently located in the site structure.

To add the sitemappath control to the main section, I simply drag and drop the sitemappath control from the toolbox to the home page. When you add a Treeview control (or menu), you must first add a sitemapdatasource control to this page. Then, add a Treeview (or menu) set the performanceid attribute to the ID of the sitemapdatasource control (this can be achieved by using the Sensitivity Label of the Treeview control ). The sitemapdatasource control queries a site map through the site navigation API and provides the complete site map structure to the Treeview (or menu) control.

The following screen snapshot shows the website that is accessed through a browser. Note: The Treeview control on the left lists the complete content of the site map. Click any node in the Treeview control to quickly direct the user to the appropriate part. The sitemappath control on the top instructs users where they are at the site level (that is, Home> books> novels ).

Vi. Conclusion

This article is the first article in the series of ASP. NET 2.0 website navigation functions. In this article, we analyzed the foundation of site navigation, which consists of two steps: using a site map to define the structure of a site and using a navigation control to implement site map. Fortunately, ASP. NET 2.0 makes all of these operations very simple.

While analyzing the basis of the site map, we also explored some more advanced functions. For example, by using ASP. NET 2.0 role features, you can limit some parts of the site, in this way, the part displayed in the navigation control depends on the user accessing role and the role defined in this part of the site map file. In addition, the site map also supports localization and attributes-this can easily make the title and description of each page of your site easily support each language. All of this and how to create a custom site navigation provider are discussed in the following articles.