RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Creating Web Sites with ASP.NET 2.0 : Page 6

If you're just starting to create ASP.NET web sites—or just switching to ASP.NET 2.0—you can get up to speed quickly with this handy guide.

Site Navigation
ASP.NET 2.0's site navigation features make it easy to add functionality that helps your users navigate your site. To implement these navigation features you'll use an XML site map file containing the structure of your site. The structure of your site contains all of the pages in the site and how they relate to each other. To add a new site map to your site, select "Add New Item" from the project shortcut menu. Select Site Map from the Add New Item dialog box and accept the default name of web.sitemap (see Figure 22).

Figure 22: Select Site Map on the Add New Item dialog to create a navigational site map.

The web.sitemap XML file contains two types of XML elements: a single siteMap and multiple siteMapNodes. Table 3 describes the structure and attributes of a siteMapNode.

Table 3. SiteMapNode Attributes: The table lists and describes SiteMapNode attributes.




Describes where the page is located in the Web site. If the file is located in the application root directory just use the file name (~/benefits.aspx, for example). If the file is located in a subdirectory beneath the application root directory, be sure to include the name of the subdirectory (~/members/reservations.aspx). Each url specified in the site map must be unique.


Specifies the text that will appear in the menu.


Specifies the tooltip text for the item (optional).

ASP.NET resolves the web application root operator (~) to the root of the current application. For example, the URL ~/Images/somepicture.gif would resolve to http://www.takenote.com/images/somepicture.gif.

ASP.NET 2.0 provides three navigation controls that can take advantage of the site map (see Listing 4). You will find these controls in the Navigation section of the Toolbox.

Figure 23: The SiteMapPath control displays a bread crumb trail that tracks a user's location in the site.
Figure 24: Select Edit Menu Items… to manually configure a menu when not specifying a data source.
  • The SiteMapDataSource control, located on the Data tab in the Toolbox, connects the navigation controls to the site map.
  • The SiteMapPath control provides a bread crumb trail to keep the user informed of their location in the site hierarchy (see Figure 23). Selecting the "Auto Format…" option from the SiteMapPath Tasks menu (displayed by clicking the control's smart tag glyph) provides a way to configure the display of the control.
  • The Menu control displays a menu horizontally or vertically. You configure the menu direction and create menu items with submenu items below them. Menu items that are always displayed are called static items, while submenus that appear only when the user hovers the mouse over a static menu item are called dynamic menus, and their sub-items as dynamic menu items. Each different menu item type has its own set of associated visual styles, so you can get just the right look and feel for your menus.
You can manually create and maintain menus, or you can bind them to a SiteMapDataSource control. Clicking the smart tag glyph for the Menu control displays the Menu Tasks options. Like the SiteMapPath control, the "Auto Format…" option presents a list of pre-defined visual styles available for the control. The Choose Data Source option defines whether you want to maintain the menu manually or if you want to bind it to a SiteMapDataSource. Leave the data source as None and click on "Edit Menu Items…" to manually configure the menu. Using the Menu Item Editor (see Figure 24) you add root items and child items below them. The Text property for a menu item specifies the text to appear in the menu. The NavigateURL property specifies where to redirect users when they click a menu item. Menus bound to a SiteMapDataSource display menu items that reference the nodes defined in the site map pointed to by the SiteMapDataSource control.

The MenuItemClick event fires when the user clicks a menu item and provides an opportunity for you to code an event handler. In the code below, e.Item refers to the item the user clicked:

   Protected Sub Menu1_MenuItemClick( _
      ByVal sender As Object, _
      ByVal e As 
         System.Web.UI.WebControls. MenuEventArgs) _
      Handles Menu1.MenuItemClick
      Dim Message As String = e.Item.Text
   End Sub
TreeView Control
The TreeView control provides a hierarchical display of information. While this example uses it as a navigational control, you can use the TreeView control to display information from a wide variety of data sources including XML files, strings, or from data retrieved from a database. Within the Treeview control each individual item is called a node. A TreeView control has three types of nodes:

  • Root. Top-level node that has no parent node. Root nodes have one or more child nodes.
  • Parent. A mid-level node that has a parent node and one or more child nodes.
  • Leaf. A bottom-level node that has no child nodes.
You can expand a node by clicking the plus (+) sign or collapse it by clicking the minus (-) sign associated with the node.

Figure 25: Add, remove, indent, and move TreeView items up or down with the TreeView Node Editor.
You populate the TreeView control similarly to the way you populate a Menu control—by either manually creating and maintaining nodes or binding a TreeView to a SiteMapDataSource control. Clicking the smart tag glyph displays the TreeView Tasks dialog box. The "Auto Format…" option provides a wide variety of predefined formatting options. Use the Choose Data Source option to specify whether you want to maintain the TreeView manually or bind it to a SiteMapDataSource. Leave the data source as None and click "Edit Nodes…" to configure the TreeView manually (see Figure 25).

That should be enough to keep you busy for a while. When you are ready to continue learning more about ASP.NET 2.0, I suggest you explore the data access and data binding capabilities, the caching feature to increase the performance of your site, and working with the portal architecture and associated web parts.

Jim Duffy is founder and president of TakeNote Technologies, an award-winning training and software development company. He has a BS degree in Computer and Information Systems and over 19 years of programming and training experience. He is an energetic trainer, skilled developer, and has been published in leading developer-oriented publications. Jim, a Microsoft MVP award recipient, is a popular speaker at regional user groups and developer conferences. He is also a co-host of Computers 2K4, a call-in radio show on WRBZ (AM 850), 850 The Buzz, in Raleigh, NC. Jim is also the author of TakeNote's popular VFP database auditing product, FoxAudit. In addition to his duties with TakeNote, Jim is also the VP of Sales & Marketing for Red Matrix Technologies, a SQL Server tools vendor who's SQLAudit product adds complete audit trail support for SQL Server databases. Additional information about Jim, TakeNote Technologies, and Red Matrix Technologies can be found at www.takenote.com.
Email AuthorEmail Author
Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date