10.3. Implementing Navigation in ASP.NET Web Sites

While ASP.NET 2.0 provides a number of controls to implement site navigation, almost all of them depend on a sitemap. A sitemap is simply an XML file (called web.sitemap) that stores the navigational information about the site in a structured format. The ASP.NET navigation controls use this XML file as a source of data to display the information contained in different graphical manners.

10.3.1. Creating sitemaps

SharePoint Designer provides a template file that allows you to start building a web.sitemap file for your Web site. To create a web.sitemap file, choose File New to display the New dialog box. In the ASP.NET section of the Page tab is the Site Map option. The default sitemap file that SharePoint Designer creates has the following code:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
   <siteMapNode url="" title=""  description="">
         <siteMapNode url="" title=""  description="" />
         <siteMapNode url="" title=""  description="" />
   </siteMapNode>
</siteMap>

The sitemap XML file needs the <siteMap> element as the root element for the XML structure. Within the <siteMap> element, there needs to be at least one <siteMapNode> element that describes the name, relative URL, and description of the link in the site navigation. Then, you have a </siteMapNode> that helps define the nested navigation links. The following code is a sample XML for the web.sitemap file:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
   <siteMapNode url="~/default.htm" title="Home"  description="Home
   Page">
         <siteMapNode url="~/InsertingWebComponents.htm" title="Web
   Components"  description="Inserting web components on web pages" />
         <siteMapNode url="~/StandardControls.aspx" title="Standard
   Controls"  description="Inserting standard controls" />
   </siteMapNode>
</siteMap>

The ASP.NET 2.0 controls can now use this web.sitemap file to display the stored navigation. SharePoint Designer makes available the Menu, TreeView, and SiteMapPath controls for use on Web pages.

10.3.2. Using ASP.NET navigation controls

In the next exercise, you use the TreeView control to display the navigation structure defined in the web.sitemap file for the Web site. To enable the ASP.NET 2.0 controls on a Web page, you need to follow these steps:

  1. Create a web.sitemap file for your Web site.

  2. Using the Data section of the Toolbox task pane, insert a SiteMapDataSource control on a Web page where you want to insert a navigation control. This control acts as a data source and helps the navigation control retrieve data from the web.sitemap file for display.

  3. Insert the TreeView control on the Web page. The Common TreeView Tasks menu is displayed in the Design view, as shown in Figure 10.22.

  4. Using the Choose Data Source dropdown menu, select the SiteMapDataSource control you inserted on the Web page in step 2.

  5. Click the AutoFormat link to open the AutoFormat dialog box and then choose a style for the TreeView control. There are a number of interesting formats to choose from in the AutoFormat dialog box for the TreeView control. You can format the tree to look like a file structure, help file, mailbox, etc.

  6. Save the Web page and then preview it in a browser.

Figure 10.22. Choosing the data source for the TreeView control

Similarly, other navigation controls can also be bound to the SiteMapDataSource control to display navigation stored in the web.sitemap file. It's recommended to place the navigation control on a master page so that all the attached Web pages can inherit it.

NOTE

For more on master pages in ASP.NET 2.0, see Chapter 13.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.147.36.61