GridView 数据控件的七种字段类型（Fields Type）的应用

GridView共支持七种字段类型，字段原本应该叫“Column”比较恰当，但ASP.NET 2.0却采用另一个名称“Field”来表示，对于名称的命名祭司认为有点不直观，因为不明的人看了根本不知道Field代表什么东西，但既然ASP.NET 2.0使用了Field，各位就迁就一下，表9-6为GridView支持七种字段类型的说明。

表9-6  GridView字段Field类型表

Field字段类型

说  明

BoundField（数据绑定字段）

将Data Source数据源的字段数据以文本方式显示

ButtonField（按钮字段）

在数据绑定控件中显示命令按钮。根据控件的不同，它可让您显示具有自定义按钮控件（例如【添加】或【移除】按钮）的数据行或数据列，按下时会引发RowCommand事件

CommandField（命令字段）

显示含有命令的Button按钮，包括了Select、Edit、Update、Delete命令按钮（DetailsView的CommandField才支持Insert命令）

CheckBoxField（CheckBox字段）

显示为CheckBox类型，通常用于布尔值True/False的显示

HyperLinkField（超链接字段）

将Data Source数据源字段数据显示成HyperLink超级链接，并可指定另外的NavigateUrl超链接

ImageField（图像字段）

在数据绑定控件中显示图像字段

TemplateField（模板字段）

显示用户自定义的模板内容

而Field字段声明在GridView中是被包含在<Columns>...</Columns>标签区块中，请参考范例9-1完成后的HTML程序，以下为<Columns>区块声明：

<asp:GridView ID=”GridView1” runat=”server” AutoGenerateColumns=”False” DataKeyNames=”EmployeeID” DataSourceID=”SqlDataSource1” EmptyDataText=”没有数据记录可显示。”>

    <Columns>

        <asp:BoundField DataField=”EmployeeID” HeaderText=”EmployeeID”

        ReadOnly=”True” SortExpression=”EmployeeID” />

        <asp:BoundField DataField=”LastName” HeaderText=”LastName”

        SortExpression=”LastName” />

        <asp:BoundField DataField=”FirstName” HeaderText=”FirstName”

        SortExpression=”FirstName” />

        <asp:BoundField DataField=”Address” HeaderText=”Address”

        SortExpression=”Address” />

    </Columns>

</asp:GridView>

由于其HTML声明使用BoundField字段，可以证明一般数据源的字段数据值会以文本方式显示。

相比较而言，DataGrid 1.0默认只支持四种类型：（1）Bound Column，（2）Button Column，（3）HyperLink Column，（4）Template Column。故可以看出以GridView功能较为丰富，应用起来也会相对容易；而以字段名称命名的DataGrid仍沿用Column，GridView则用Field。

注

（1） 以上七种Field字段类型并非只有GridView控件独有或独享，其他如DetailsView也共享这七种字段类型。

（2）不知各位是否知道为何用“Field”这个字眼，而非用“Column”，这是因为七种类型字段主要是由DataControl-Field类派生而来的，所以字尾都会带有Field字眼。***************部分××××××××××设置SqlDataSource数据源

请设置SqlDataSource数据源为Employees数据表的EmployeeID、LastName与Photo三个字段。

  ImageHandler.ashx泛型处理方法

请在项目中加入一个ImageHandler.ashx泛型处理方法，完整程序代码如下：

01  <%@ WebHandler Language="VB" Class="ImageHandler" %>

02 

03  Imports System

04  Imports System.Web

05 

06  Public Class ImageHandler : Implements IHttpHandler

07      '获取数据库连接设置

08      Shared connString As ConnectionStringSettings =

          WebConfigurationManager.ConnectionStrings("NorthwindConnectionString")

09     

10      Public Sub ProcessRequest(ByVal context As HttpContext)       

           Implements IHttpHandler.ProcessRequest

11          'context.Response.ContentType = "text/plain"

12          'context.Response.Write("Hello World")

13          Dim ms As MemoryStream = Nothing

14          Try

15              '获取员工代号

16              Dim EmployeeID As String =    

                    context.Request.QueryString("EmployeeID")

17              '通过ReadImage类的GetImage()方法获取SQL Server中图片数据

18              '创建Sql命令

19              Dim strSQL As String = "Select Photo from Employees where

                    EmployeeID=@paramEmployeeID"

20              '创建SqlDataSource

21              Dim sqldsPhoto As New

                   SqlDataSource(connString.ConnectionString, strSQL)

22              sqldsPhoto.SelectParameters.Add("paramEmployeeID",   

                   TypeCode.Int32, EmployeeID)

23              '通过SqlDataSource进行查询

24              Dim dv As DataView = CType                   (sqldsPhoto.Select(DataSourceSelectArguments.Empty), DataView)

25              '返回DataView第一个Row的Photo字段数据

26              Dim PhotoImage As Byte() = CType(dv(0)("Photo"), Byte())

27              ms = New MemoryStream(PhotoImage, 0, PhotoImage.Length)

28          Catch ex As Exception

29 

30          End Try

31         

32          If (ms IsNot Nothing) Then

33              '获取图像MemoryStream大小

34              Dim bufferSize As Integer = CType(ms.Length, Integer)

35              '创建 buffer

36              Dim buffer As Byte() = New Byte(bufferSize) {}

37              '调用MemoryStream.Read，自MemoryStream 读取至buffer，

38           '并传回count

39              Dim countSize As Integer = ms.Read(buffer, 0, bufferSize)

40              '返回图像buffer

41              context.Response.OutputStream.Write(buffer, 0, countSize)

42          End If

43      End Sub

44 

45      Public ReadOnly Property IsReusable() As Boolean 

           Implements IHttpHandler.IsReusable

46          Get

47              Return False

48          End Get

49      End Property

50 

51  End Class

程序说明：

以上的程序从连接字符串的读取，到SqlDataSource动态程序构建，以及DataView数据类型的返回皆是正宗ASP.NET 2.0百分之百纯正语法。不过您也可以使用传统的ADO.NET语法来构建，而祭司之所以使用SqlData Source语法构建，纯粹是为了展示新一代SqlDataSource语法要如何使用罢了，无好坏之分。程序说明在批注中已讲得很清楚了，各位看得懂看不懂都不要紧，以后在各位项目中直接Copy引用就行了。

  创建TemplateField模板字段

请点击GridView智能标签的【编辑列】进入编辑模式，添加一个TemplateField模板字段以便容纳HTML <Img> 控件，并将HeaderText命名为“员工照片”。所以目前共有两个EmployeeID、LastName的BoundField字段，和一个TemplateField模板字段。

  以HTML <Img>读取ImageHandler.ashx泛型处理方法图片

然而，ImageHandler.ashx虽强，但如同千里马必须有人主动驾驭才有用，而网页必须通过HTML <Img> 来调用ImageHandler.ashx，而ImageHandler.ashx接收到其传来的工号后，以此工号读取数据库二进制图片，在一番处理后则输出到OutputStream数据流中由 <Img> 显示。故我们要在TemplateField模板字段中添加一个HTML的 <Img> 控件，请点击GridView的【编辑模板】，选择Column[2]-员工照片的ItemTemplate项目，接着再从工具箱中拖曳一个HTML的Image控件到ItemTemplate中（见图9-41），最后设置Image的Src属性为下列关键程序：

ImageHandler.ashx?EmployeeID=<%# Eval(“EmployeeID”) %>

图9-41  在Template模板中创建 <Img> Image控件

完成后请运行程序，界面如图9-42所示。

图9-42  GridView动态显示数据库图片运行界面

注

（1）Employees数据表中的Photo字段原本有78 bytes的位移，但因为这部分在某些地方会造成困扰，故祭司将照片数据重新设置过，从0 byte开始而不需要位移。在此建议您使用光盘所附的Northwind.mdf北风数据库较方便。

（2）请注意 <Img> 控件是HTML的，请勿误用到ASP.NET的Image控件。