四．TemplateColumn数据列的应用：

　　DataGrid控件中的TemplateColumn数据列可以说是功能极其强大的，灵活地运用它就能使得DataGrid控件显示数据的方式变得多种多样。TemplateColumn数据列主要为我们提供了以下四种数据列模板：

　　·HeaderTemplate
　　·ItemTemplate
　　·EditItemTemplate
　　·FooterTemplate

　　其中HeaderTemplate是用于显示DataGrid控件的首行中的文本、图片或是绑定数据的。FooterTemplate的功能与HeaderTemplate的功能类似，不过它是用于显示尾行中的内容的。EditItemTemplate是应用于具有编辑功能的数据列的，任何运用了该模板的数据列的数据能被用户编辑并在适当时候更新到数据源中。

　　ItemTemplate允许你建立具有完全自定义数据显示方式的数据列。通过运用＜%# Container.DataItem("[FieldName]") %＞或＜%# DataBinder.Eval(Container.DataItem, "[FieldName]", "{0:[FormatString]}") %＞两种数据绑定语法你就可以将数据源中的某列数据绑定到相应的数据列中并赋予完全自定义的显示方式。

　　下面我们在第三步中建立的Web应用程序中添加一个新的Web页面－WebForm2，该页面能显示公司的详细信息，也就是在图2中的按钮被点击时浏览器会导向到的页面。它能根据用户的选择显示相应公司的详细信息，方法就是判断Request.QueryString内的信息。如果其中包含了一个"id"名/值对，则根据其中的值选择相对应的公司信息并显示在页面中，如果没有包含任何"id"值的信息则从数据表中选取所有公司的信息并显示在页面中。同时还要指出的是，在一个DataGrid控件中你可以将多种类型的数据列结合起来一起使用，并根据不同的需要选择合适的数据列显示相应的数据。下面是本页面的HTML文件以及其代码后置文件的内容：

　　WebForm2.aspx：

＜%@ Page language="c#" Codebehind="WebForm2.aspx.cs" AutoEventWireup="false" Inherits="DataGridTemplates2.WebForm2" %＞
＜!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" ＞
＜HTML＞
＜HEAD＞
＜title＞WebForm2＜/title＞
＜meta name="GENERATOR" Content="Microsoft Visual Studio 7.0"＞
＜meta name="CODE_LANGUAGE" Content="C#"＞
＜meta name="vs_defaultClientScript" content="JavaScript"＞
＜meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5"＞
＜/HEAD＞
＜body MS_POSITIONING="FlowLayout"＞
＜form id="Form1" method="post" runat="server"＞
＜asp:datagrid id="myDataGrid" runat="server" ItemStyle-Font-Size="x-small" HeaderStyle-Font-Bold="True" HeaderStyle-Font-Size="x-small" AlternatingItemStyle-BackColor="#EFEFEF" Cellpadding="4" BorderWidth="1" AutoGenerateColumns="False" BorderStyle="Solid" GridLines="Horizontal" BorderColor="#404040" Font-Names="Verdana,Arial,sans-serif" Font-Size="11px"＞
＜AlternatingItemStyle BackColor="#E0E0E0"＞＜/AlternatingItemStyle＞
＜ItemStyle Font-Size="X-Small"＞＜/ItemStyle＞
＜HeaderStyle Font-Size="X-Small" Font-Bold="True" ForeColor="White" BackColor="Teal"＞＜/HeaderStyle＞
＜Columns＞
＜asp:TemplateColumn＞
＜HeaderTemplate＞
＜b＞Company Detail＜/b＞
＜/HeaderTemplate＞
＜ItemTemplate＞
＜table border="0" Cellpadding="4" Cellspacing="0" Width="100%" style="FONT-SIZE: 11px; FONT-FAMILY: Verdana, Arial, sans-serif"＞
＜tr＞
＜td colspan="4"＞
＜b＞
＜%# DataBinder.Eval( Container.DataItem, "CompanyName" ) %＞
＜/b＞
＜/td＞
＜/tr＞
＜tr＞
＜td width="25%" valign="top"＞＜b＞Contact:＜/b＞＜/td＞
＜td width="25%" valign="top" nowrap＞
＜%# DataBinder.Eval( Container.DataItem, "ContactName" ) %＞
＜/td＞
＜td width="25%" valign="top"＞＜b＞Phone:＜/b＞＜/td＞
＜td width="25%" valign="top" nowrap＞
＜%# DataBinder.Eval( Container.DataItem, "Phone" ) %＞
＜/td＞
＜/tr＞
＜tr＞
＜td width="25%" valign="top"＞＜b＞Title:＜/b＞＜/td＞
＜td width="25%" valign="top"＞
＜%# DataBinder.Eval( Container.DataItem, "ContactTitle" ) %＞
＜/td＞
＜td width="25%" valign="top"＞＜b＞Fax:＜/b＞＜/td＞
＜td width="25%" valign="top" nowrap＞
＜%# DataBinder.Eval( Container.DataItem, "Fax" ) %＞
＜/td＞
＜/tr＞
＜tr＞
＜td width="25%" valign="top"＞＜b＞Address:＜/b＞＜/td＞
＜td width="25%" valign="top" colspan="3"＞
＜%# DataBinder.Eval( Container.DataItem, "Address" ) %＞
＜br＞
＜%# DataBinder.Eval( Container.DataItem, "City" ) %＞
,
＜%# DataBinder.Eval( Container.DataItem, "Region" ) %＞
＜%# DataBinder.Eval( Container.DataItem, "PostalCode" ) %＞
＜br＞
＜%# DataBinder.Eval( Container.DataItem, "Country" ) %＞
＜/td＞
＜/tr＞
＜/table＞
＜/ItemTemplate＞
＜/asp:TemplateColumn＞
＜/Columns＞
＜/asp:datagrid＞
＜/form＞
＜/body＞
＜/HTML＞

WebForm2.aspx.cs：
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Data.SqlClient;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace DataGridTemplates2
{
/// ＜summary＞
/// WebForm2 的摘要说明。
/// ＜/summary＞
public class WebForm2 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid myDataGrid;

private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
if( !Page.IsPostBack )
BindData();
}

private void BindData()
{
DataSet ds = new DataSet();
SqlDataAdapter da;
String strSQL;

if( Request.QueryString["id"] == null )
strSQL = "SELECT * FROM Customers";
else
strSQL = "SELECT * FROM Customers WHERE CustomerID = '" + Request.QueryString["id"].ToString() + "'";

da = new SqlDataAdapter( strSQL, "server=localhost;integrated security=true;database=Northwind" );
da.Fill( ds, "Customers" );
myDataGrid.DataSource = ds.Tables["Customers"].DefaultView;
myDataGrid.DataBind();
}

#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN：该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}

/// ＜summary＞
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// ＜/summary＞
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}

　　新页面创建完毕，在浏览器中运行的效果如图3所示：


图3 DataGrid控件中运用TemplateColumn数据列显示数据的效果。

　　五．总结：

　　到此为止，我想大家已经基本掌握了在Web应用程序中运用DataGrid控件自定义数据显示的方法了。相比于DataList控件和Repeater控件，DataGrid控件具有更多强大的功能，而且其自定义数据显示的功能也不弱。所以只要你好好掌握其中的技巧和方法，运用DataGrid控件也同样可以使得你的Web应用程序不仅具有强大的数据处理功能，而且非常富有个性。