Simple Navigation with Hyperlinks
| The simplest way to link two pages together is with a hyperlink. In ASP.NET, you have several choices for creating a hyperlink, including the following:
The important distinction between the various approaches is whether HTML that performs navigation or postback is generated. The first three approaches in the list just presented generate the familiar <a> element, such as: <a href="next page">link text here</a> For the first two approaches, you specify the attributes in your page using the standard HTML attribute names, such as href, target, and title. If you use the second approach, you can also set the link text for the element using the InnerText or InnerHtml properties, because the element is implemented on the server using the HtmlAnchor class. To implement a hyperlink that acts as an anchor at a specific position within the page, you use the Name property, as shown in Listing 10.1. Listing 10.1. Creating a Hyperlink and Anchor using the HtmlAnchor Control
If the target anchor is within another page, you simply include the URL of that page in the HRef attribute: <a runat="server" href="page2.aspx#para1">...</a> You can place other controls within the <a> element. For example, you can create a clickable image that causes navigation to another page (or to an anchor in the same page), as shown in Listing 10.2. Listing 10.2. Creating a Clickable Image Using the HtmlAnchor Control
This uses the <img> element directly, and not a server control. However, if you want to interact with the image (perhaps to specify the filename at runtime) you can replace it with an HtmlImage server control by adding the runat="server" attribute, or use an ASP.NET Image server control instead.
Details of the HtmlAnchor class are at http://msdn2.microsoft.com/en-us/library/9ssczfkc(en-US,VS.80).aspx. Details of the HtmlImage control are at http://msdn2.microsoft.com/en-us/library/ky66zc99(en-US,VS.80).aspx. The ASP.NET Hyperlink ControlASP.NET includes the Hyperlink control, which provides a much more structured and simpler approach to generating hyperlinks of all kinds. It can generate text links or clickable images, and it provides a wide range of properties that conform to the standard naming convention for server controls. To generate a simple hyperlink, you just need this: <asp:Hyperlink runat="server" NavigateUrl="mypage.aspx" Text="Click here" /> Like many server controls, you can also declare the content within the element tags, like this: <asp:Hyperlink runat="server" NavigateUrl="mypage.aspx">Click here</asp:Hyperlink> To create a clickable image, you specify the ImageUrl property instead of the Text property, and ASP.NET automatically creates an <a> element with an embedded <img> element. It even turns off the display of the border of the image automatically by including the border="0" attribute. The Target property specifies the name of the browser window in which to open the page if you do not want it to show in the same window. The ToolTip property sets the title attribute of the <a> element and <img> element, and many other properties are available for specifying the style and appearance of the link.
Details of the Hyperlink server control are at http://msdn2.microsoft.com/en-us/library/1076w1hx(en-US,VS.80).aspx. Using Access KeysMany of the interactive server controls in ASP.NET provide the AccessKey property, which you can use to implement shortcut or hot-key access to that control. You set the AccessKey property to a single-character string that is the key the user will press in conjunction with the Alt key to move the input focus to that control. For example, this declares a Hyperlink control that receives the input focus if the user presses Alt+N when the page is displayed: <asp:Hyperlink runat="server" AccessKey="N" NavigateUrl="mypage.aspx" Text="Click here" /> Other Controls That Create HyperlinksMany other controls in ASP.NET generate normal HTML hyperlinks. For example, the BulletedList control you saw in Chapter 8 has a DisplayMode property that, when set to Hyperlink, causes the control to generate a list of text bullets that are wrapped in an <a> element (see Listing 10.3). Listing 10.3. Creating a List of Hyperlinks Using the BulletedList Control
In a similar way, the TReeView control described in Chapter 9 provides pure navigation capabilities. Each node in the tree is a treeNode instance that exposes the NavigateUrl and Target properties. To generate an <a> hyperlink element for a node, set the NavigateUrl to anything other than an empty string (which is the default). Many of the more complex server controls also create hyperlinks behind the scenes. The TReeView and Menu controls generate "skip links" allowing non-visual user agents to navigate past the control to the content of the page that follows. For example, the TReeView example in Chapter 9 generates this hyperlink located in the page just before the control's output: <a href="#ctl00_RightContentHolder_trvResult_SkipLink" <img alt="Skip Navigation Links." src="/books/1/268/1/html/2/..path to resource file.." width="0" height="0" style="border-width:0px;" </a> Then, after the control's output: <a ></a> Other controls that create hyperlinks include the AdRotator control, the ImageMap control (described in Chapter 8), the Menu control (described later in this chapter), and the various types of hyperlink column that you can use in the GridView and DetailsView list controls (described in Chapters 3 and 4). |
EAN: 2147483647
Pages: 147