Asp.net| Control
First, Introduction
Any web site made up of multiple pages requires some kind of navigational user interface, which is created in two steps. First, you must define the logical structure of the site, and then add user interface elements to allow users to move back and forth between parts of the site structure. Before ASP.net 2.0, developers were asked to solve both problems themselves. However, after version 2.0, ASP.net provides an easy way to define the structure of a site and includes a large number of Web controls-specifically designed to display the site navigation user interface.
In the previous article, we analyzed how to create Web.sitemap XML sitemap files by navigating Web controls and how to display site navigation information, including:
· SiteMapPath, it shows a breadcrumb (Home>electronics>xbox)
· TreeView, which displays a folded, vertically-displayed tree that displays the entire site map hierarchy
· menu, which displays a horizontal or vertical line of menus
The previous article provides a rough overview of the functionality and capabilities of the site-map files and navigation Web controls. In this section, we'll turn our attention to programming control of site map information and analyze the SiteMapPath navigation Web controls in detail.
Second, site map
The examples in this article use the site map that you created in the first section. You can see the exact syntax of the site map XML file in the first section or download it at the end of this article. Graphical representations of site structures are used in these examples, as shown in the following figure:
third, the programming control site Map
A site map is a collection of linked site map nodes. Typically, each site map node contains a title, a URL, and a description. The image shown above is an example of a site map where each rectangle represents a site map node. Asp. NET does not require a particular format to specify a site map, although it does provide a default choice for using an XML format file. (For details about XML files please refer to the first article)
Asp. NET provides a class called sitemap-it provides read-only, programmatic access to the site map. This class is used internally by two controls, and we'll analyze the two classes later in this article:
· Sitemappath-generates a breadcrumb based on the visited page and its site structure location. Specifically, the SiteMapPath starts with the node returned by the Sitemap.currentnode property and traverses the hierarchy up to the root.
· Sitemapdatasource-This control to create a hierarchical data source-it maps the structure of the site map. To display site map information in another Web control, such as TreeView or menu, the Web control does not query the site map directly; instead, they bind to a SiteMapDataSource control-it is responsible for reading the site map structure.
The Sitemap class has two properties: RootNode and CurrentNode. Both of these properties return the SiteMapNode instance. The SiteMapNode class represents a node that is defined in a site map and has attributes-title,url and description that describe the node, plus a property-parentnode,childnodes that programmatically controls the hierarchy. Nextsibling,previoussibling, wait.
You can use the Sitemap class on your own asp.net page. For example, we can display next,previous and up links in each page-just by adding three hyperlink controls to the main page of the site, plus a little programming to check if CurrentNode has a nextsibling, PreviousSibling or parentnode. Specifically, you will add the following tags to your homepage:
[ prev ] |
[ up ] |
[ next ]
The Page_Load event handler for the main page appears as follows:
if sitemap.currentnode IsNot nothing Then
' Set next/previous/up link
If SiteMap.CurrentNode.PreviousSibling IsNot Nothing Then
Lnkprev.navigateurl = SITEMAP.CURRENTNODE.PREVIOUSSIBLING.URL
Lnkprev.text = "< Prev (" & SiteMap.CurrentNode.PreviousSibling.Title & ")"
Else
Lnkprev.navigateurl = String.Empty
Lnkprev.text = ' < Prev '
End If
if SiteMap.CurrentNode.ParentNode IsNot nothing Then
Lnkup.navigateurl = Sitemap.currentno De. Parentnode.url
Lnkup.text = "Up" ("& SiteMap.CurrentNode.ParentNode.Title &")
Else
Lnkup.navigateu RL = String.Empty
Lnkup.text = ' up '
End If
if SiteMap.CurrentNode.NextSibling IsNot nothing Then
Lnknext . NavigateUrl = SiteMap.CurrentNode.NextSibling.Url
Lnknext.text = "(& SiteMap.CurrentNode.NextSibling.Title & Amp ") Next >
Else
lnknext.navigateurl = String.Empty
Lnknext.text =" Next > "
End If
End if
This will add three hyperlinks next,up and previous to each page that inherits from the main page, as shown in the snapshots below.
The markup and code needed to complete this feature are found in the source text attached to this article.
iv. display breadcrumbs with SiteMapPath control
The SiteMapPath control displays a breadcrumb-that is used to show the user where they are located in the structure of the site. The output of the SiteMapPath control is determined by the following three factors:
• The structure of the site, defined by the site map,
• Visited pages and
· SiteMapPath control's property value
When you access a page with a SiteMapPath control, the SiteMapPath control attempts to map the URL of the page to the URL value of a site map node that is defined in the site map. If a match is found, the control traverses the structure upstream to the root and makes the following output: rootnode>parentnode> ... >parentnode>currentnode. Here the CurrentNode is the title of the site map node-it is used to map the current page request Url;rootnode and Parentnodes are delivered as super chains, if the site map node has a URL value defined in the site map. One of the SiteMapPath controls in the History Books page (books/history.aspx) generates Home>books>history, as well as home and books in the form of hyperlinks, Points back to Default.aspx and books/default.aspx respectively. When accessing books/default.aspx, SiteMapPath generates Home>books.
It is clear that the SiteMapPath output relies on both the site map itself and the page being accessed. The output of the SiteMapPath can be customized through the properties of the control. There are some properties-backcolor,font,forecolor for standard Web control formats, and so on-there are some SiteMapPath-specific settings, including:
U pathdirection-can take one of the two values they are roottocurrent (default) or Currenttoroot. When the value is Roottocurrent, the breadcrumb on the "History Books" page becomes home>books>history; When the value is Currenttoroot, the output is history>books>home.
· pathseparator-Specifies the string used to separate each node in the breadcrumb;
· Rendercurrentnodeaslink-A Boolean Property-it specifies whether the CurrentNode should be born as a link, and the default is False.
· parentlevelsdisplayed-an integer value-it can be used to limit the height of the tree layer structure displayed by the breadcrumb. By default, this property value is-1, which means there is no limit; the value is set to 1, then the breadcrumb books>history is generated on the History books page. The root is not included, because the SiteMapPath control simply traverses up to a parent-from "History" to "book".
· showtooltips-If a site map node has a descriptive value, the description is displayed as a hint text for each breadcrumb node, if this property is set to True (by default).
There are also style attributes that can be used to set backcolor,font,forecolor, and so on-to sitemappath parts of a control. You can use the NodeStyle property to customize the appearance of nodes in breadcrumb, and you can use RootNodeStyle and CurrentNodeStyle to further customize the first and last nodes in the breadcrumb. Generally, the simplest and most aesthetically attractive way to format the SiteMapPath control is to use its "Auto Format" wizard-which can be started with the control's sensitive tag.
custom-generated output with templates
The SiteMapPath contains four templates-they allow for further customization of the generated output. Templates allow you to mix static HTML tags, Web controls, and data-binding syntax, and if you have previously used DataList or Repeater controls, you are familiar with templates. The template in ASP.net 2.0 is basically the same as in ASP.net 1.x, except that ASP.net 2.0 introduces some new, more refined syntax for data-binding expressions. For example, in ASP.net 1.x, you must use the syntax <%# DataBinder.Eval (Container.DataItem, PropertyName)%> to obtain a column of values. In asp.net 2.0, this old-fashioned syntax is still available, but you can selectively use a shorter version of <%# Eval (PropertyName)%>.
By default, SiteMapPath generates root and parent nodes as a regular hyperlink, so that when the user clicks on the link, they can quickly roll up on the control hierarchy tree. However, you may want to do some server-side processing before sending the information back to the user-perhaps you want to record where the user is going or automatically save any changes they have made on the page. This can be accomplished by using a template and by making the Node a LinkButton.
For example, if you just want to make the root of SiteMapPath a LinkButton, you can add a <RootNodeTemplate> to the SiteMapPath control using the following tag:
Text= ' <%# Eval ("title")%> '
Commandargument= ' <%# Eval ("url")%> '
Oncommand= "Linkbutton1_command" >
This tag adds a LinkButton control to sitemappath-its Text property is assigned to the corresponding SiteMapNode title property. When the LinkButton is clicked, it causes a postback and the command event of the control fires-this activates the Linkbutton1_command event handler. The SiteMapNode URL property is passed through the CommandArgument property to the event handler. In this event handler, you can do any server-side processing, and then Response.Redirect (e.commandargument) the user to the page they are requesting.
