ASP.NET HyperLink Control


In all of the previous examples, we have made use of the HTML Anchor element, represented by an <a> tag. As well as being able to create a hyperlink by hand, we can also use an ASP.NET control to do this, allowing us to make use of more functionality based upon the underlying control. This is similar to the way that a DataGrid is rendered as a table, even though it provides much more functionality.

Try It Out—Using a HyperLink Control

In this example, we'll create a page that a presents a hyperlink to the user, which, when clicked on, will show them a different picture of the band depending on the time of the day. We'll do this by manipulating the target and text of the link at the server.

  1. Open up the Default.aspx file within Web Matrix in Design view. This time, instead of selecting the HTML Elements tab from the Toolbox, select the Web Controls tab, and drag a HyperLink control onto the canvas, between the Downloads hyperlink and the Links title. From the properties panel, change the ID property to lnkTimeOfDay, so that we can reference it from within code easily.

  2. Next, switch to Code view. Remove the two lines of code that being with a single quote ('), and enter the following text into the editor so that the link is altered when the page is loaded:

     Private Sub Page_Load(ByVal sender As System.Object, _  ByVal e As System.EventArgs)  If Now.Hour<12 Then  lnkTimeOfDay.Text = "Cornflakes before lunch"  lnkTimeOfDay.NavigateURL = "PhotoAM.aspx"  Else  lnkTimeOfDay.Text = "Cornflakes after lunch"  lnkTimeOfDay.NavigateURL = "PhotoPM.aspx"  End If End Sub 
  3. Save the file, and click the Start button in the toolbar to display the file in a browser window. You should see that if the time is before midday, the text Cornflakes before lunch is shown, whereas Cornflakes after lunch will be displayed if it is after midday. When you click on the URL, it will also take you to a different file depending on the time of the day. The two files that are linked to – PhotoAM.aspx and PhotoPM.aspx – are both included as part of the setup package for the Cornflakes at Midnight application.

    To see the text and link change, simply open up the system clock (by right clicking on the taskbar, and selecting Adjust Date/Time), alter the time of day to the other side of midday (or midnight), and click Apply. Then switch back to Internet Explorer and click Refresh. Don't forget to change the clock back once you're finished playing!

    click to expand

    click to expand

    Clicking on this link will take you to:

    click to expand

How It Works

Just like the data controls we've already looked at (such as the MxDataGrid), the Hyperlink control is processed by the web server and rendered into HTML before being returned to the client. The few lines of code that we entered in the file are called whenever the page is run – the .NET runtime knows to automatically execute the Page_Load routine every time the page is loaded.

The code itself does very little – it makes a call to the Now() function, finds out the hour of the day, and based upon that, sets the Text and NavigateURL properties of the HyperLink control. The Text property is that which is displayed on the screen to the end user – the text we can edit from within Design view. The NavigateURL property is the ASP.NET equivalent of the href attribute we set on the HTML Anchor element.

When the page is run, the hyperlink that is rendered in the browser is dynamically generated, with its text and target URL attributes being determined by those set in the Page_Load subroutine.




Beginning Dynamic Websites with ASP. NET Web Matrix
Beginning Dynamic Websites: with ASP.NET Web Matrix (Programmer to Programmer)
ISBN: 0764543741
EAN: 2147483647
Year: 2003
Pages: 141

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net