考察DataGrid Web 控件 Part 1

本文英文原版:
http://aspnet.4guysfromrolla.com/articles/040502-1.aspx

考察DataGrid Web 控件 Part 1

导言：

经典ASP（classic ASP）的最常见的任务之一便是从数据库获取信息并展示在一个HTML表格里面.我们需要很多HTML和代码混合在一起的行才能达到该目的.通常情况下看起来应该像如下这个样子：

Create Database Connection
Populate a recordset based on some SQL query
Output the HTML table header (<table ...>)
Loop through the recordset
Emit the HTML for a table row
...
Emit the HTML table footer (</table>)

ASP.NET的优势在于其包含了很多的Web控件.这些编辑HTML的控件允许开发者将代码和内容分离，并在代码里将HTML实体当作一个对象.也即，如果我们想用ASP.NET展示某些HTML内容，将像下面这样做：

<script language="vb" runat="server">
sub Page_Load(sender as Object, e as EventArgs)
lblMessage.Text = "Hello, World!"
end sub
</script>

<asp:label runat="server" id="lblMessage" />

这里的label Web控件lblMessage看起来和HTML标签很类似，只是有一个runat="server"属性.在Page_Load事件处理器（每次登录页面时都会发生）里，lblMessage的Text属性被设置为"Hello, World!".我们在这里使用Web控件就达到了将代码从内容（content）分离的目的；如果是在经典ASP，为达到相同的效果，我们必须将<%="Hello, World!"%>放置在HTML内容的适当地方.

DataGrid控件比label控件更有用也更强大.DataGrid对绑定的HTML table相应地产生必需的HTML，就像随后我们将看到的那样，将数据绑定到DataGrid是很容易的；另外，通过小小的改动，我们就可以对外观进行定制，呈现出很漂亮的HTML表格（ HTML tables）.

DataGrid控件基础

要在ASP.NET Web页面上添加一个DataGrid控件，你仅仅需要添加如下的代码：

<asp:datagrid runat="server" id="ID_of_DataGrid" />

其中id值便是DataGrid控件的名字，当你在服务器端代码里引用该控件时就会用到它.为了使DataGrid展示我们所需要的有用东西，我们将把它绑定到某个信息集（collection of information），该信息集可以是任何支持IEnumerable界面的的对象，比如Arrays, collection classes（ArrayList, 哈希表等）,DataSets, DataReaders以及其它的对象.
在本文，我们把DataGrid绑定到DataReader.它和ADO/ASP里的Recordset差不多.要了解使用ADO.NET将数据库查询结果写入DataReader的更多细节请参阅文章《read: Efficiently Iterating Through Results from a Database Query using ADO.NET》（译注：网址为http://aspnet.4guysfromrolla.com/articles/032702-1.aspx）

那怎么样将数据绑定到DataGrid呢？非常简单！首先我们要创建一个包含数据库数据的DataReader控件.本例，我们使用ASPFAQs.com的数据库，返回10个最常见的FAQs（即常见问题解答）.为将DataReader绑定到DataGrid，我只需要写2行代码.第一行代码将DataGrid控件的DataSource属性设置为DataReader；第二行代码调用DataGrid控件的DataBind方法.
要做的就是这些，就像下面的代码展示的那样：

<% @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>

<asp:datagrid id="dgPopularFAQs" runat="server" />

（注：查看示例的页面为http://aspnet.4guysfromrolla.com/articles/040502-1.aspx）

我们注意到，实现数据绑定的代码一点也不多.在代码里我们创建了一个连接，指定一个SQL命令（在此为一个名为sp_Popularity的存储过程），打开数据库连接，将DataGrid的DataSource属性设置为返回的DataReader，最后调用DataGrid的DataBind方法.该方法完全实现了代码和内容的分离.与经典ASP相比，没有出现HTML table和DataReader的输出结果混杂在一起的情况（意既经典ASP没有实现代码和内容的分离）

花些时间来查看那个示例页面吧，DataGrid展示了我们想要的结果，虽然外观不太好看，但"显示数据"这个目的是达到了的。要美化界面也是很容易的，下一节我们就来探讨这个问题。

结语：
本节，我们考察了DataGrids的基础知识——怎样在页面添加控件并展示绑定的数据，不幸的是界面比较糟糕.然而，正如我们即将看到的那样，美化其界面简直是小菜一碟，另外我们将考察一些用户界面高级选项（比如分页，排序），当然这些是下一节的内容。

祝编程快乐！