在本文第二部分我們研究了如何通過ButtonColumn標(biāo)記在DataGrid中顯示按鈕。此外，我們考察了如何將事件處理程序與按鈕的點(diǎn)擊聯(lián)系起來。下面我們將了解到如何判斷DataGrid中哪一行的按鈕被點(diǎn)擊并且基于這些信息執(zhí)行相應(yīng)的動作。
判斷哪一行的按鈕被點(diǎn)擊
回想一下點(diǎn)擊按鈕的事件處理程序定義如下：
Sub eventHandlerName(sender as Object, e as DataGridCommandEventArgs)
...
End Sub
DataGridCommandEventArgs類包含一個Item屬性，該屬性包含了觸發(fā)該事件的源對象。Item屬性是TableRow類的一個實(shí)例，它指向DataGrid中被點(diǎn)擊的那一行。可使用Cells屬性訪問TableRow類中的列。例如有一個DataGrid,它的列信息定義如下：
<asp:DataGrid runat="server" ... >
<Columns>
<asp:ButtonColumn Text="Details" HeaderText="FAQ Details" CommandName="details" />
<asp:BoundColumn DataField="FAQID" HeaderText="FAQ ID" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
</Columns>
</asp:datagrid>
那么在點(diǎn)擊按鈕的事件處理程序中，可通過以下方法獲得被點(diǎn)擊行的某一列的值：
Sub detailsClicked(sender as Object, e As DataGridCommandEventArgs)
Dim buttonColumn as TableCell = e.Item.Cells(0)
Dim FAQIDColumn as TableCell = e.Item.Cells(1)
Dim DescColumn as TableCell = e.Item.Cells(2)
Dim buttonColText as String = buttonColumn.Text
Dim FAQIDColText as String = FAQIDColumn.Text
Dim DescColText as String = DescColumn.Text
End Sub
示例運(yùn)行結(jié)果如下:
更新按鈕事件處理程序后的DataGrid示例
本示例展示了一個包含Detail按鈕的DataGrid Web控件并演示了當(dāng)按下按鈕時如何觸發(fā)一段代碼。注意點(diǎn)擊某個Detail按鈕后你會看到被點(diǎn)擊按鈕所在行的信息。
Value of Clicked Button Column Text:
Value of FAQID Column Text: 181
Value of Clicked Description Column Text: How can I format numbers and date/times using ASP.NET? For example, I want to format a number as a currency.
| FAQ Details | FAQ ID | FAQ Description |
| | 144 | Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)? |
| | 181 | How can I format numbers and date/times using ASP.NET? For example, I want to format a number as a currency. |
| … | | |
源代碼
<% @Import Namespace="System.Data" %>
<% @Import Namespace="System.Data.SqlClient" %>
<script language="vb" runat="server">
Sub Page_Load(sender as Object, e as EventArgs)
If Not Page.IsPostBack then
BindData()
End If
End Sub
Sub BindData()
'1. Create a connection
Dim myConnection as New SqlConnection(ConfigurationSettings.AppSettings("connectionString"))
'2. Create the command object, passing in the SQL string
Const strSQL as String = "sp_Popularity"
Dim myCommand as New SqlCommand(strSQL, myConnection)
'Set the datagrid's datasource to the datareader and databind
myConnection.Open()
dgPopularFAQs.DataSource = myCommand.ExecuteReader(CommandBehavior.CloseConnection)
dgPopularFAQs.DataBind()
End Sub
Sub dispDetails(sender as Object, e As DataGridCommandEventArgs)
Dim buttonColumn as TableCell = e.Item.Cells(0)
Dim FAQIDColumn as TableCell = e.Item.Cells(1)
Dim DescColumn as TableCell = e.Item.Cells(2)
Dim buttonColText as String = buttonColumn.Text
Dim FAQIDColText as String = FAQIDColumn.Text
Dim DescColText as String = DescColumn.Text
lblBCT.Text = buttonColText
lblFCT.Text = FAQIDColText
lblDCT.Text = DescColText
End Sub
</script>
<form runat="server">
<b>Value of Clicked Button Column Text</b>:
<asp:label id="lblBCT" runat="server" /><br />
<b>Value of FAQID Column Text</b>:
<asp:label id="lblFCT" runat="server" /><br />
<b>Value of Clicked Description Column Text</b>:
<asp:label id="lblDCT" runat="server" /><br />
<asp:DataGrid runat="server" id="dgPopularFAQs"
BackColor="#eeeeee" Width="85%"
HorizontalAlign="Center"
Font-Name="Verdana" CellPadding="4"
Font-Size="
OnItemCommand="dispDetails">
<HeaderStyle BackColor="Black" ForeColor="White" Font-Bold="True" HorizontalAlign="Center" />
<AlternatingItemStyle BackColor="White" />
<Columns>
<asp:ButtonColumn Text="Details" HeaderText="FAQ Details" CommandName="details" ButtonType="PushButton" />
<asp:BoundColumn DataField="FAQID" HeaderText="FAQ ID" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
</Columns>
</asp:datagrid>
</form>
請仔細(xì)檢查上面的示例。你可能注意到的第一件事就是按鈕列不包含任何文本。這是因?yàn)閮H需通過HTML即可顯示按鈕，因此TableCell的Text屬性返回了一個空字符串。
在本文開始部分我講述了一個電子商務(wù)公司的場景，該公司希望顯示部分貨運(yùn)信息，但同時提供顯示所有貨運(yùn)信息的選擇。到目前為止的示例中，我們僅顯示了sp_Popularity存儲過程返回列中的一小部分列。想象一下我們僅希望顯示最受歡迎的常見問題的描述列，然后提供一個Detail按鈕允許用戶查看某個常見問題的其余信息。
雖然我們不希望在DataGrid中顯示FAQID列，但是我們?nèi)匀恍枰獮?span lang="EN-US" style="FONT-FAMILY: 'Times New Roman'">detialsClicked
事件處理程序提供該信息，因?yàn)樗鼣?shù)據(jù)庫中表的關(guān)鍵字并唯一標(biāo)識了每個常見問題。通過對DataGrid標(biāo)記進(jìn)行小小的改動(在與數(shù)據(jù)庫中FAQID列對應(yīng)的BoundColumn標(biāo)記中增加Visible=
"False")，我們?nèi)匀荒軌騻鬟f該信息。此改動隱藏了FAQID列，但仍然允許detailClicked事件處理程序訪問某個常見問題的標(biāo)識(通過e.Item.Cells(1).Text)。因此我們所要做的就是改寫detailsClicked事件處理程序，以便當(dāng)它被觸發(fā)時獲得用戶希望顯示的那個常見問題的信息，然后再顯示該常見問題的詳細(xì)信息。在閱讀了一系列關(guān)于如何使用DataGrid的文章后，當(dāng)需要顯示數(shù)據(jù)庫中的數(shù)據(jù)時，你的第一個想法應(yīng)該就是使用DataGrid。因此我們的頁面看起來應(yīng)該是這樣:
<script language="vb" runat="server">
Sub Page_Load(sender as Object, e as EventArgs)
If Not Page.IsPostBack then
BindData() 'Only bind the data on the first page load
End If
End Sub
Sub BindData()
'Make a connection to the database
'Databind the DataReader results to the gPopularFAQs DataGrid.
End Sub
Sub detailsClicked(sender as Object, e As DataGridCommandEventArgs)
'Get detailed information about the selected FAQ and bind
'the database results to the dgFAQDetails DataGrid
End Sub
</script>
<form runat="server">
<asp:DataGrid runat="server" id="dgFAQDetails" ... >
...
</asp:datagrid>
<asp:DataGrid runat="server" id="dgPopularFAQs" ... >
<Columns>
<asp:ButtonColumn Text="Details" HeaderText="FAQ Details"
ButtonType="PushButton" />
<asp:BoundColumn DataField="FAQID" Visible="False" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
</Columns>
</asp:datagrid>
</form>
示例運(yùn)行結(jié)果如下:
本示例展示了如何在DataGrid的每一行中顯示概要信息和一個Detail按鈕，當(dāng)按鈕被點(diǎn)擊時，對所選擇的數(shù)據(jù)項(xiàng)顯示其余信息。
| Category Name | FAQ Description | Views | Author | Author's Email | Date Added |
| Getting Started | Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)? | 163,148 | Scott Mitchell | mitchell@4guysfromrolla.com | |
| FAQ Details | FAQ Description |
| | Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)? |
| … | |
源代碼
<% @Import Namespace="System.Data" %>
<% @Import Namespace="System.Data.SqlClient" %>
<script language="vb" runat="server">
Sub Page_Load(sender as Object, e as EventArgs)
If Not Page.IsPostBack then
BindData()
End If
End Sub
Sub BindData()
'1. Create a connection
Dim myConnection as New SqlConnection(ConfigurationSettings.AppSettings("connectionString"))
'2. Create the command object, passing in the SQL string
Const strSQL as String = "sp_Popularity"
Dim myCommand as New SqlCommand(strSQL, myConnection)
'Set the datagrid's datasource to the datareader and databind
myConnection.Open()
dgPopularFAQs.DataSource = myCommand.ExecuteReader(CommandBehavior.CloseConnection)
dgPopularFAQs.DataBind()
End Sub
Sub dispDetails(sender as Object, e As DataGridCommandEventArgs)
Dim FAQID as Integer = Convert.ToInt32(e.Item.Cells(1).Text)
'Get information about the particular FAQ
Dim myConnection as New SqlConnection(ConfigurationSettings.AppSettings("connectionString"))
'2. Create the command object, passing in the SQL string
Dim strSQL as String = "spGetFAQ"
Dim myCommand as New SqlCommand(strSQL, myConnection)
myCommand.CommandType = CommandType.StoredProcedure
' Add Parameters to SPROC
Dim parameterFAQId as New SqlParameter("@FAQID", SqlDbType.Int, 4)
parameterFAQId.Value = FAQID
myCommand.Parameters.Add(parameterFAQId)
'Set the datagrid's datasource to the datareader and databind
myConnection.Open()
dgFAQDetails.DataSource = myCommand.ExecuteReader(CommandBehavior.CloseConnection)
dgFAQDetails.DataBind()
dgFAQDetails.Visible = True 'Make the FAQ Details DataGrid visible
End Sub
</script>
<form runat="server">
<asp:DataGrid runat="server" id="dgFAQDetails"
BackColor="#eeeeee" Width="90%"
HorizontalAlign="Center"
Font-Name="Verdana" CellPadding="4"
Font-Size="
Visible="False">
<HeaderStyle BackColor="Black" ForeColor="White" Font-Bold="True" HorizontalAlign="Center" />
<AlternatingItemStyle BackColor="White" />
<Columns>
<asp:BoundColumn DataField="CatName" HeaderText="Category Name" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
<asp:BoundColumn DataField="ViewCount" DataFormatString="{0:#,###}"
HeaderText="Views" ItemStyle-HorizontalAlign="Center" />
<asp:BoundColumn DataField="SubmittedByName" HeaderText="Author" />
<asp:BoundColumn DataField="SubmittedByEmail" HeaderText="Author's Email" />
<asp:BoundColumn DataField="DateEntered" HeaderText="Date Added"
DataFormatString="{0:MM-dd-yyyy}" />
</Columns>
</asp:datagrid>
<p>
<asp:DataGrid runat="server" id="dgPopularFAQs"
BackColor="#eeeeee" Width="85%"
HorizontalAlign="Center"
Font-Name="Verdana" CellPadding="4"
Font-Size="
OnItemCommand="dispDetails">
<HeaderStyle BackColor="Black" ForeColor="White" Font-Bold="True" HorizontalAlign="Center" />
<AlternatingItemStyle BackColor="White" />
<Columns>
<asp:ButtonColumn Text="Details" HeaderText="FAQ Details" ButtonType="PushButton" />
<asp:BoundColumn DataField="FAQID" Visible="False" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
</Columns>
</asp:datagrid>
</form>
需要注意的第一件事就是ASP.Net Web頁面中有兩個DataGrid。第一個(dgFAQDetails)用于顯示一個特定常見問題的詳細(xì)信息。第二個(dgPopularFAQs)是我們一直用來顯示最受歡迎的10個常見問題的那個DataGrid。注意dgPopularFAQs DataGrid的FAQID綁定列被修改了，增加了Visible="False"，以便FAQID列不在dgPopularFAQs DataGrid的輸出中顯示。
在過去的三篇文章中我們研究了將數(shù)據(jù)庫查詢的結(jié)果顯示在HTML表格中(第一篇)，在無需編寫代碼的情況下美化HTML表格(第二篇)和本篇中如何在每列中增加按鈕并對事件進(jìn)行響應(yīng)。我們將在今后的文章中看到“增加按鈕并當(dāng)按鈕被點(diǎn)擊時進(jìn)行響應(yīng)”的概念可被擴(kuò)展以允許進(jìn)行排序、分頁和編輯數(shù)據(jù)?；匾?span lang="EN-US">……
祝編程愉快！
