5.8 HyperlinkfromaRowintheDataGridtoaDetailPage
Often, I need to zero in and display data based on a record inthe DataGrid control. How
do I display detail information ina separate pagefroma DataGrid control?
Technique
One of the types of columns that you can use inthedatagrid is theHyperLink column.
This column makes it fairly easy to link pages based on data. To see how theHyperLink
type column is used in this How-To, take a look at Figure 5.14.
Figure 5.14. No code is required for link pages based on data.
By your specifying the URL Field to be ProductID and URL Format String to be
wfrmHowTo5_8b.aspx?ID={0}, thedatagrid automatically calls the
wfrmHowTo5_8b.aspx and passes the ProductID tothe form when you click on a
product.
Steps
Open and run the Visual Basic .NET-Chapter 5 solution. Fromthe main page, click on
the hyperlink with the caption How-To 5.8: HyperlinkFromaRowintheDataGridtoa
Detail Page. You then see all the products loaded into adata grid. Notice that the
products are actually hyperlinks (see Figure 5.15).
Figure 5.15. These hyperlinks require no code to call adetail page.
When you click on a product, another page is displayed, with detail information supplied
(see Figure 5.16).
1. Create a Web Form. Then place the controls in Table 5.12 and Figure 5.15 with
the following properties set.
Table 5.12. Property Settings for the Controls Used on the First Page of This
How-To
Object Property Setting
OleDbDataAdapter ID odaProducts
SelectCommand SELECT ProductID, ProductName
FROM Products
DataSet ID dsProducts
DataGrid ID dgProducts
DataSource dsProducts
DataKeyField ProductID
DataMember Products
HyperLink ID hplReturnToMain
NavigateURL wfrmMain.aspx
2. Right-click on the DataGrid control and choose Property Builder. Click on the
Columns tab and set the properties as displayed in Figure 5.14. Be sure to note the
name of the form you are calling inthe URL Format String so that you can name it
the same in step 4.
3. Add the code in Listing 5.30 tothe Load event of the page.
Listing 5.30 wfrmHowTo5_8a.aspx.vb: Filling and Binding the Products to
the DataGrid Object
Private Sub Page_Load(ByVal sender As System.Object,
ByVal e As System.EventArgs) Handles MyBase.Load
'Put user code to initialize thepage here
odaProducts.Fill(DsProducts)
dgProducts.DataBind()
End Sub
4. Create another Web Form. Then place the controls in Table 5.13 and Figure 5.16
with the following properties set.
Table 5.13. Property Settings for the Controls Used on the Second Page of
This How-To
Object Property Setting
Label Text Product Name
Label Text Unit Price
TextBox ID txtProductName
TextBox ID txtUnitPrice
5. Add the code in Listing 5.31 tothe Load event of the page. Inthe SQL select
statement created in this listing, the Request.Item is used to grab the productID
that was passed fromthe first form. The dtProdIndiv data table is filled, and the
individual column information is loaded into the text boxes.
Listing 5.31 wfrmHowTo5_8b.aspx.vb: Loading theDetail Information Based
on the ProductID
Private Sub Page_Load(ByVal sender As System.Object,
ByVal e As System.EventArgs) Handles MyBase.Load
'Put user code to initialize thepage here
Dim odaProdIndiv As OleDb.OleDbDataAdapter
odaProdIndiv = New _
OleDb.OleDbDataAdapter(_
"Select * From Products Where ProductID = " &
Request.Item("ID"), BuildCnnStr("(local)", "Northwind"))
Dim dtProdIndiv As New DataTable()
odaProdIndiv.Fill(dtProdIndiv)
With dtProdIndiv.Rows(0)
Me.txtProductName.Text = .Item("ProductName")
Me.txtUnitPrice.Text = .Item("UnitPrice")
End With
End Sub
Figure 5.16. You will use the request object in code on this pageto retrieve detail
data.
Comments
That's it! A good way to expand this example is to add the coding technique learned in
the previous How-To for editing data.
Using data with your Web Forms is not much harder than using Windows Forms. Just
remember to stash some variables for round trips tothe server and to bind your data.
.
5.8 Hyperlink from a Row in the Data Grid to a Detail Page
Often, I need to zero in and display data based on a record in the DataGrid control .NET-Chapter 5 solution. From the main page, click on
the hyperlink with the caption How -To 5.8: Hyperlink From a Row in the Data Grid to a
Detail Page.