這篇文章是一系列關于使用DataGrid Web控件文章的第三篇。ASP.Net DataGrid Web控件可將數據庫信息顯示在HTML表格中，并且功能強大。在第一篇文章中我們討論了DataGrid的基本功能；在第二篇文章中我們討論了設定DataGrid顯示屬性的信息。本文將研究如何將事件與DataGrid聯系起來。

導言

在第一篇文章中我們研究了DataGrid的基本功能 (它是一個被設計用于在HTML表格標簽中顯示數據的ASP.Net Web控件)，展示了通過ASP.Net頁面顯示數據庫內容是如何的簡單。在第二篇文章中我們研究了如何自定義DataGrid的顯示。正如在先前演示(Demo)中看到的，通過很少的程序代碼我們就能以印象深刻的格式顯示數據庫信息。

雖然顯示數據非常有效，但是真正有用的是能否將某種形式的動作與DataGrid聯系起來。例如，想象一下你正在為某個電子商務公司工作并被要求通過DataGrid顯示所有訂單信息。每一個訂單含有很多相關的數據，包括訂購的商品、訂購時間、購買者的信息(姓名、地址等)、購買者選擇的運貨方式等。在一個DataGrid中(為每一個訂單)顯示所有這些信息將會導致過度的信息顯示。

正如在DataGrid Web控件深度歷險(2)中看到的，我們可以通過將AutoGenerateColumns屬性設為False,然后通過Columns屬性指定需要顯示的列。雖然這種做法使得數據易于理解，但是如果用戶同時希望能夠查看到任意一個訂單的復雜細節，那又該怎么做呢？理想地我們希望在DataGrid的每一行上有一個標記為Detail的按鈕，當點擊這個按鈕后將顯示訂單的全部信息。

本文的示例將引領讀者創建一個非常類似的應用。在前面的演示中我們顯示了ASPFAQs.com最受歡迎的10個常見問題。本文將對該演示進行擴充以顯示10個常見問題的最關鍵信息，同時每一行包含一個Detail按鈕。

構建基礎

我們在第二篇文章中提到DataGrid控件允許在DataGrid的Columns標記中放置一些BoundColumn標記�；叵胍幌旅恳粋�BoundColumn標記代表DataGrid中的一列。為了將按鈕放置在DataGrid中，我們可以使用ButtonColumn標記，這與BoundColumn標記的用法很類似。下面的代碼顯示如何將按鈕放置在DataGrid中:

<form runat="server">
<asp:DataGrid runat="server" id="dgPopularFAQs"
BackColor="#eeeeee" Width="85%"
HorizontalAlign="Center"
Font-Name="Verdana" CellPadding="4"
Font-Size="10pt" AutoGenerateColumns="False">
<HeaderStyle BackColor="Black" ForeColor="White" Font-Bold="True"
HorizontalAlign="Center" />
<AlternatingItemStyle BackColor="White" />

<Columns>
<asp:ButtonColumn Text="Details" HeaderText="FAQ Details" />
<asp:BoundColumn DataField="FAQID" Visible="False" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
</Columns>
</asp:datagrid>
</form>
示例運行結果如下:

包含按鈕的DataGrid

本示例顯示一個包含Detail按鈕的DataGrid Web控件。按鈕以鏈接形式顯示；若想使鏈接成為標準的按鈕，需要在ButtonColumn標記中輸入ButtonType=”PushButton”.

FAQ Details
FAQ ID
FAQ Description

Details
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)?

Details
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)
BindData()
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
</script>

<form runat="server">
<asp:DataGrid runat="server" id="dgPopularFAQs"
BackColor="#eeeeee" Width="85%"
HorizontalAlign="Center"
Font-Name="Verdana" CellPadding="4"
Font-Size="10pt" AutoGenerateColumns="False">
<HeaderStyle BackColor="Black" ForeColor="White" Font-Bold="True" HorizontalAlign="Center" />
<AlternatingItemStyle BackColor="White" />

<Columns>
<asp:ButtonColumn Text="Details" HeaderText="FAQ Details" />
<asp:BoundColumn DataField="FAQID" HeaderText="FAQ ID" />
<asp:BoundColumn DataField="Description" HeaderText="FAQ Description" />
</Columns>
</asp:datagrid>
</form>



請注意為了使示例正常運行，需要將DataGrid放置在一個服務器端的表單中(如上所示黑體的<form runat=”server”>)。這是因為為了跟蹤被點擊的按鈕和應該發生的關聯動作，ASP.Net頁面應能夠重新創建頁面和DataGrid中的一系列按鈕。為了做到這一點需要使用頁面的狀態信息(ViewState)。對狀態信息的討論超出了本文的范圍；為了獲取更多信息請閱讀: Form Viewstate。

注意在示例中創建的按鈕是一個文本鏈接按鈕。這是ButtonColumn類生成的缺省外觀。如果想顯示一個標準的按鈕，可在ButtonColumn標記中指定ButtonType=”PushButton”。ButtonColumn類包含一些重要的屬性。在上面的代碼中使用了兩個格式方面的屬性。HeaderText屬性指定DataGrid中按鈕所在列的頁眉中的文字。Text屬性指定了每個按鈕的文本顯示。與BoundColumn標記類似，ButtonColumn標記可將每個按鈕的文本設為DataGrid的DataSource屬性中某一列的值-在ButtonColumn類中省略掉Text屬性并將DataTextField屬性設為數據庫中某個列的名稱，該列的值將作為按鈕的文本。