A Beginners Guide to the HyperinkField

At first glance, the HyperlinkField (used in the GridView) seems fairly straightforward, but on second glance, you might be a little intimidated on how to use it. In this tutorial, we’ll be only focusing on using it in a Gridview which is being populated by a database, so the properties we’ll be looking at will be fewer.

The main concept of the HyperLinkField is to act as a regular HTML hyperlink in your Gridview, using data retrieved dynamically from your datasource.

The four main properties into which we’ll be looking are the DataTextField, HeaderText, DataNavigateURLFields, and DataNavigateUrlFormatString.

We’ll get HeaderText out of the way first since it’s the simplest of all of them. This, of course, is what appears in the Header of the Gridview, atop the HyperlinkField’s column. You can change it any way you’d like and it won’t affect anything else in your data retrieval

Next, we’ll look at the DataTextField. This, too, is fairly straight-forward. It will be what is actually displayed in each row, using the data retrieved from the datasource. For instance, if you’re field/column is from the FirstName field in your database, then, it would display Tom, Cathy, David, etc.

The last two properties at which we’re looking interact with each other. First, think of a link you have to another page. If it were a regular HTML hyperlink, you’d have something like this:
Report
Now, think of this in terms of adding a querystring to the url:
Report

In a Gridview scenario, this column, in each row, could have a different actual querystring based on particular results retrieved from the database in that record. In this scenario, you’d want the actual URL to be the same URL for each record, but the querystring ‘ID’ would be different. For the purpose of this scenario, let’s say the ‘ID’ is coming from a field in the database called ‘MasterID’.

Therefore, to do this, we’d set the DataTextField property to MasterID (which will display the number itself), and we’d set the DataNavigateURLFields property to MasterID (this sets the querystring). Next, in order to get the complete URL (Report.aspx?id=27), we’d also set the DataNavigateURLFormatString to Report.aspx?id={0}. We also need to make sure that the exact path is listed here, so if the Report.aspx file is in a different folder, that needs to be reflected here. Having {0} at the end, tells it to use whatever is listed in the DataNaviageURLFields property for the querystring. That’s basically all there is to it.

So, you’d end up with something like this:
DataTextField="MASTERID"
HeaderText="ID #"
DataNavigateUrlFields="MASTERID
DataNavigateUrlFormatString="Report.aspx?ID={0}" />
If you need multiple querystrings, just add them to the DataNavigateURLFields property, separated by commas. Then, in the DataNavigateURLFormatString property, being zero based, add them as needed.
For instance:
DataNavigateUrlFields=”MASTERID, EmpID
DataNavigateUrlFormatString=”Report.aspx?ID={0}&empID={1}” />

As you can see, this is fairly straightforward, given the right scenario!

Related Posts:

• No Related Posts