这篇文章是一系列关于使用DataGrid Web控件文章的第三篇ASPNet DataGrid Web控件可将数据库信息显示在HTML表格中并且功能强大在第一篇文章中我们讨论了DataGrid的基本功能在第二篇文章中我们讨论了设定DataGrid显示属性的信息本文将研究如何将事件与DataGrid联系起来
导言
在第一篇文章中我们研究了DataGrid的基本功能 (它是一个被设计用于在HTML表格标签中显示数据的ASPNet Web控件)展示了通过ASPNet页面显示数据库内容是如何的简单在第二篇文章中我们研究了如何自定义DataGrid的显示正如在先前演示(Demo)中看到的通过很少的程序代码我们就能以印象深刻的格式显示数据库信息
虽然显示数据非常有效但是真正有用的是能否将某种形式的动作与DataGrid联系起来例如想象一下你正在为某个电子商务公司工作并被要求通过DataGrid显示所有订单信息每一个订单含有很多相关的数据包括订购的商品订购时间购买者的信息(姓名地址等)购买者选择的运货方式等在一个DataGrid中(为每一个订单)显示所有这些信息将会导致过度的信息显示
正如在DataGrid Web控件深度历险()中看到的我们可以通过将AutoGenerateColumns属性设为False然后通过Columns属性指定需要显示的列虽然这种做法使得数据易于理解但是如果用户同时希望能够查看到任意一个订单的复杂细节那又该怎么做呢？理想地我们希望在DataGrid的每一行上有一个标记为Detail的按钮当点击这个按钮后将显示订单的全部信息
本文的示例将引领读者创建一个非常类似的应用在前面的演示中我们显示了最受欢迎的个常见问题本文将对该演示进行扩充以显示个常见问题的最关键信息同时每一行包含一个Detail按钮
构建基础
我们在第二篇文章中提到DataGrid控件允许在DataGrid的Columns标记中放置一些BoundColumn标记回想一下每一个BoundColumn标记代表DataGrid中的一列为了将按钮放置在DataGrid中我们可以使用ButtonColumn标记这与BoundColumn标记的用法很类似下面的代码显示如何将按钮放置在DataGrid中:
<form runat=server>
<asp:DataGrid runat=server id=dgPopularFAQs
BackColor=#eeeeee Width=%
HorizontalAlign=Center
FontName=Verdana CellPadding=
FontSize=pt AutoGenerateColumns=False>
<HeaderStyle BackColor=Black ForeColor=White FontBold=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
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
How can I format numbers and date/times using ASPNET? For example I want to format a number as a currency
…
源代码:
<% @Import Namespace=SystemData %>
<% @Import Namespace=SystemDataSqlClient %>
<script language=vb runat=server>
Sub Page_Load(sender as Object e as EventArgs)
BindData()
End Sub
Sub BindData()
Create a connection
Dim myConnection as New SqlConnection(ConfigurationSettingsAppSettings(connectionString))
Create the command object passing in the SQL string
Const strSQL as String = sp_Popularity
Dim myCommand as New SqlCommand(strSQL myConnection)
Set the datagrids datasource to the datareader and databind
myConnectionOpen()
dgPopularFAQsDataSource = myCommandExecuteReader(CommandBehaviorCloseConnection)
dgPopularFAQsDataBind()
End Sub
</script>
<form runat=server>
<asp:DataGrid runat=server id=dgPopularFAQs
BackColor=#eeeeee Width=%
HorizontalAlign=Center
FontName=Verdana CellPadding=
FontSize=pt AutoGenerateColumns=False>
<HeaderStyle BackColor=Black ForeColor=White FontBold=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>)这是因为为了跟蹤被点击的按钮和应该发生的关联动作ASPNet页面应能够重新创建页面和DataGrid中的一系列按钮为了做到这一点需要使用页面的状态信息(ViewState)对状态信息的讨论超出了本文的范围为了获取更多信息请阅读: Form Viewstate
注意在示例中创建的按钮是一个文本链接按钮这是ButtonColumn类生成的缺省外观如果想显示一个标准的按钮可在ButtonColumn标记中指定ButtonType=PushButtonButtonColumn类包含一些重要的属性在上面的代码中使用了两个格式方面的属性HeaderText属性指定DataGrid中按钮所在列的页眉中的文字Text属性指定了每个按钮的文本显示与BoundColumn标记类似ButtonColumn标记可将每个按钮的文本设为DataGrid的DataSource属性中某一列的值在ButtonColumn类中省略掉Text属性并将DataTextField属性设为数据库中某个列的名称该列的值将作为按钮的文本
