介绍

我们可以通过控制Headerstyle、RowStyle、AlternatingGrowstyle等属性来改变GridView、DetailsView、FormView的样式，比如CSS Class、Font、BorderWidth、BorderStyle、Bar、Width、Height等等。

通常，自定义格式与我们要显示的数据值相关。例如，为了吸引用户对那些库存为空的产品的关注，我们可以将UnitsInStock和UnitsOnOrder 0对应字段的数据背景颜色设置为黄色。为了突出那些昂贵的产品，UnitsInStock高于75.00美元的数据字体设置为粗体。

自定义GridView、DetailsView、FormView格式的方法有很多。在本文中，我们将使用数据绑定和行数据绑定事件。在下一篇文章中，我们将尝试以另一种方式在GridView控件中使用TemplateField。

将数据绑定到DetailsView控件时，使用DetailsView控件的数据绑定事件，无论是从数据控件填充数据还是对数据源属性进行编码并调用其DataBind()方法。将触发以下事件。

1.触发1。数据绑定事件。

2.数据绑定到数据绑定控件。

3.3。触发数据绑定事件。

通常，在1、2和3之后，数据会通过事件立即填充数据控件。我们还可以自定义事件处理，以确定数据是否已经填充到控件中，并根据我们的需要调整显示格式。举个例子吧。我们将创建一个DetailsView来列出产品的一般信息，并在单价超过75.00美元时以粗体和斜体显示单价的值。

步骤1:在详细视图中显示产品信息。

在CustomFormatting文件夹下，创建一个新的CustomColors.aspx页面，将一个DetailsView控件从工具箱拖到该页面，设置ID expensive productpriceinindionditalic以绑定到新的数据源，并将该数据源配置为业务对象的ProductsBLL类中的GetProducts()方法。这个的详细实现步骤前面已经详细描述过了，这里就忽略了。

当您将ObjectDataSource绑定到DetailsView时，我们可以修改字段列表。我选择删除产品标识、供应商标识、类别标识、库存单位、单位订单、再订购级别和那些未绑定的字段。它们不会显示在DetailsView列表中，但留下的那些可以重命名，并且可以修改它们的显示格式。我还清除了DetailsView的“高度”和“宽度”属性，这样当只显示一条数据时就不会出现样式混乱的情况。当然，我们面对的不是只有一条数据。显示器怎么样？我们可以检查在DetailsView的IntelliSense中是否选中了“启用分页”复选框，这样我们就可以查看页面中的所有数据。

图1:检查DetailsView的值感知中是否选中了启用分页属性。

进行这些更改后，DetailsView的代码将更改为。

asp3360 detailsview ID=' detailsview 1 ' runat=' server ' AllowPaging=' True ' AutoGenerateRows=' False ' DataKeyNames=' Product ID ' data sourceid=' objectdata source E1 ' EnableViewState=' False '字段asp3360 boundfield data field=' Product name ' header text=' Product ' sort expression=' Product name '/asp3360 boundfield data field=' CategoryName ' header text=' Category ' ReadOnly

图2: DetailsView控件一次显示一个数据。

步骤2:编码并确定数据绑定事件中的数据值。

为了以粗体和斜体显示单价高于75.00美元的产品，我们首先需要编码来确定单价的值。对于DetailsView，我们可以通过DataBound事件来完成。我们选择DetailsView并查看属性视图(F4快捷键)。如果未显示，请选择“查看属性窗口”，双击数据绑定事件或输入要创建的事件的名称，同时确保选择了“详细信息视图”。

图3:为数据绑定事件创建一个事件处理程序。

下面的代码将在代码中自动生成。

protected void expensiveproductpriceinbolidalic _ data bound(对象发送方，EventArgs e){}我们可以通过DataItem属性(由一些强类型的DataRow组成的强类型DataTable)设置DetailsView的绑定项。当数据表绑定到DetailsView时，数据表的第一行将自动绑定到DetailsView的DataItem属性，DataItem属性包含DataRowView(对象类型)。我们可以通过数据行视图访问producterrow的数据行实例，还可以检查对象的值以确定producterrow实例是否存在。

下面的代码描述了如何确定单价是否绑定到DetailsView并高于$75.00。

受保护的void expensiveproductpriceinbolidalic _ data bound(对象发送方，事件参数e){ //从DataItem属性获取ProductsRow对象.北风。产品行产品=(北风。产品行()((系统。data . datarow view)expensiveproductpriceinboltic。DataItem)。划；if(！product . isunipricenfull(). product . unitprice 75m){//todo :使UnitPrice文本加粗和斜体}}注意：当数据库中unitprice的值为空时，我们在绑定到ProductsRow的unit price属性之前检查它是否为空是非常重要的，因为我们可以通过检查此属性来抛出强类型异常strongtypeexception。

步骤3:在详细视图中格式化单价。

此时，我们已经知道要绑定的单价是否高于75美元。现在我们来看看如何通过编码来调整UnitPrice的格式。我们可以修改DetailsViewID。行[索引]。修改一行数据，我们可以通过访问detailsview id来访问一个单元格。行[索引]。单元格[索引]，这样我们就可以通过修改与格式相关的属性来格式化这个单元格。

要访问某一行，需要获取某一行的索引。索引从0开始，单价是DetailsView中的第15行。假设它在第四行，我们可以通过ExpensiveProductSpriceInbold访问它。行[4]。此时，我们可以通过下面的代码以粗体和斜体显示这一行。

ExpensiveProductsPriceInBoldItalic。行[4]。font . bold=true；ExpensiveProductsPriceInBoldItalic。行[4]。但是，这将格式化标签和值，如果我们只想格式化值，并且需要将格式应用到当前行的第二帧，请参见以下代码。

ExpensiveProductsPriceInBoldItalic。行[4]。单元格[1]. font . bold=true；ExpensiveProductsPriceInBoldItalic。行[4]。单元格[1]。font . Italic=true；

我们也可以通过样式表显示标签和样式相关的信息，而不是用某一行或某一列来设置格式。我们使用CSS来控制格式，打开Styles.css文件，并添加一个名为ExpensivePriceEmphasis的新类。遵循以下代码CSS。费用价格重点font-style:斜体；}

然后，在数据绑定事件中，将单元的CssClass设置为ExpensivePriceEmphasis，并将其添加到数据绑定事件处理中。

看柴(成本低于75.00美元)时，价格会以正常格式显示(图4)，但看米什科比尼库(价格为97.00美元)时，会以我们设置的格式显示(图5)。

如果价格低于$75.00，图4:将以正常格式显示。

如果价格高于75.00美元，图5:将以粗体和斜体显示。

使用FormView控件的DataBound事件绑定到FormView数据的步骤与DetailsView类似，即创建一个DataBound事件处理程序，声明绑定到控件的DataItem类型属性，然后执行绑定。然而，它们以不同的方式更新。

控件不包括任何绑定列也不包含行的集合，取而代之的是他由一系列包含若干静态网页控件，绑定表达式的模板组合。调整控件的外观涉及到调整一个或多个控件的模板

让我们像前一个例子那样用控件列出产品项，但是这次我们仅仅用红色字体显示单位小于等于10的产品的名字和单位

步骤1:在控件中显示产品信息

添加一个控件到CustomColors.aspx中，设置其身份为低库存产品红色，像前一个步骤一样绑定数据到对象数据源中，这将在控件中创建项目模板，编辑项目模板，和插入项目模板。

移除编辑模板和插入项模板并在模板列中仅包含商品名称和表中的一列项，在智能感知中检查允许分页（分页)标记是否被选上

在这些操作后控件的代码大概会成这样

asp3360 formview ID=' low stockedproductsinred ' runat=' server ' DataKeyNames=' product ID ' DataSourceID=' object data source 1 '允许分页=' True ' EnableViewState=' False '项目模板产品：标签ID=' product name lab ' runat=' server ' Text=' % # Bind('产品名称')% '/asp3360标签br/库存单位： asp:标签' ID='注意模板列包含的代码：

静态HTML”产品："和"库存单位："包含br /和元素。

网控件 两个标签控件，ProductNameLabel和UnitsInStockLabel .

绑定表达式% #绑定(“ProducT name”)%和%# Bind('UnitsInStock') %表达式，绑定值到标签的文本属性上

步骤2:在数据绑定事件处理中编码确定数据的值

当控件的标记完成后，下一步就是确定表中的一列的值是否小于等于10,这里和在详细视图中类似，先创建数据绑定事件

图6: 创建数据绑定事件处理

在事件中声明控件的属性属性到产品行实例中，确定单价的值并将对应的值用红色字体显示

受保护的void低库存产品sinred _ data bound(对象发送方，事件参数e){ //从属性属性获取产品行对象.北风。产品行产品=(北风。产品行()((系统。数据行视图)低库存产品红色数据项目).划；if(！产品IsUnitsInStockNull()产品UnitsInStock=10) { //TODO:使UnitsInStockLabel的文本为红色} }步骤3:在控件的模板列中格式化单位库存标签标签

最后一步就是要在模板列中设置UnitsInStockLabel的样式为红色字体，在ItemTempelete中查找控件可以使用FindControl("控件标识”)方法

WebControlType某些名称=(WebControlType)formviewID .查找控件(' CONtrol id ')；

对于我们这个例子我们可以用如下代码来查找该标签控件

标签单位库存=(标签)低库存产品库存查找控件(' UnitsInStockLabel ')；当我们找到这个控件时则可以修改其对应的风格属性，在style.css中已经有一个写好的低单位库存强调的钢性铸铁类，我们通过下面的代码将钢性铸铁类设置到对应的属性

受保护的void低库存产品sinred _ data bound(对象发送方，事件参数e){ //从属性属性获取产品行对象.北风。产品行产品=(北风。产品行()((系统。数据行视图)低库存产品红色数据项目).划；if(！产品IsUnitsInStockNull()产品。单位库存=10) {标签单位库存=(标签)低库存产品库存查找控件(' UnitsInStockLabel ')；if (unitsInStock！=null) { unitsInStock .CSS类=' LowUnitsInstockEnhanced} }}注意： 这种方式在控件和显示数据表格（一种控件)中也可以通过设置模板字段来达到同样的效果，我们将在下一篇中讨论模板字段.图七显示控件在当表中的一列大于10的情况，图8则显示小于等于10的情况

图7 : 在高于10的情况下，没有值被格式化

图8:小于等于10时，数值以红色字体显示。

使用GridView的RowDataBound事件自定义格式。

我们在前面的FormView和DetailsView中讨论了数据绑定的步骤。现在我们来复习一下。

通过数据绑定事件触发数据绑定到数据绑定控件对FormView和DetailsView有效，因为只需要显示一个数据，而在GridView中，需要显示所有数据。与前三步相比，第二步有些不同。

在第2步中，GridView列出了所有数据，将为某个记录创建一个GridViewRow实例并绑定，添加到GridView的每个GridViewRow的两个事件将触发3360。

创建的行在创建GridViewRow时触发。

行数据绑定当当前记录绑定到GridViewRow时触发。

对于GridView，请使用以下步骤。

数据绑定事件为每一行数据触发到数据绑定控件的数据绑定。

A.创建GridViewRow。

B.触发行创建事件。

C.将数据绑定到GridViewRow。

D.触发行数据绑定事件。

E.将GridViewRow添加到Rows集合中。

由数据绑定事件触发。

为了自定义和格式化GridView单独的记录，我们需要为RowDataBound事件创建事件处理程序。让我们向CustomColors.aspx添加一个GridView，显示名称、类别和价格，并用黄色背景突出显示那些价格低于10.00美元的产品。

步骤1:在GridView中显示产品信息。

在窗体视图的底部添加一个GridView，并将ID设置为HighlightCheapProducts。我们已经设置了一个ObjectDataSource来获取产品数据。现在，在将GridView绑定到ObjectDataSource之后。编辑GridView的绑定列以包含名称。产品的类别和价格属性。完成GridView后，代码将为：

asp: GridView ID=' highlight cheap products ' runat=' server ' AutoGenerateColumns=' False ' DataKeyNames=' ProductID ' data sourceid=' objectdata source 1 ' Enabl eview state=' False '列asp3360 boundfield data field=' Product name ' header text=' Product ' sort expression=' Product name '/asp: boundfield data field=' CategoryName ' header text=' Category ' ReadOnly=' True ' sort expression='

图9: GridView显示了产品的名称、类别、价格。

步骤2:对RowDataBound事件处理中的数据进行编码并确定对应的值。

当产品数据表绑定到GridView时，GridView将生成几个产品行。GridViewRow的DataItem属性将生成一个实际的ProductRow。在GridView的RowDataBound事件发生之后，为了确定UnitsInStock的值，我们需要为RowDataBound创建一个EventHandler，在其中我们可以确定UnitsInStock的值，并对其进行相应的格式化。EventHandler的创建过程与前面两个相同。

图10:创建GridView的行数据绑定事件的事件处理。

以下代码将在后台代码中自动生成。

Protected void突出显示products _ RowDataBound(对象发送方，GridViewRowEventArgs e) {}当触发RowDataBound事件时，第二个参数gridviewrowargs包含对GridViewRow的引用。我们使用以下代码来访问GridViewRow中的ProductsRow。

受保护的void highlightechepproducts _ row databound(对象发送方，GridViewRowEventArgs e){ //从DataItem属性获取ProductsRow对象.北风。产品行产品=(北风。产品行()((系统。数据行视图)。划；if(！产品。isunitpriceneull()产品。unitprice 10m) {//todo:突出显示黄色行.}}当使用RowDataBound事件时，GridView由各种类型的行组成，该事件对所有行类型都发生。GridViewRow的类型可以由RowType属性确定，并且可以是以下类型之一。

数据行GridView数据源中的记录。

空数据行由GridView的数据源显示的行为空。

页脚底线；显示由GridView的ShowFooter属性决定。

表头表头行；显示由GridView的ShowHeader属性决定。

分页GridView的分页，这一行显示分页的标记。

分隔符不适用于GridView，但对数据列表和收割器的行类型属性有用。我们将在以后的文章中讨论它们。

当以上四个(DataRow、Pager Rows Footer、Header)不适合对应的值时，就会返回一个空的数据项，所以我们需要在代码中检查GridViewRow的RowType属性来确定：

受保护的void highlight cheap products _ RowDataBond(对象发送方，GridViewRowEventArgs e){ //请确保我们使用的是数据行，如果(e . Row . RowType==DatacontrolRowType。DataRow) { //从DataItem属性中获取ProductsRow对象.北风。产品行产品=(北风。产品行()((系统。数据行视图)。划；if(！产品。isUnitPricenfull()产品。unitprice 10m) {//todo:突出显示黄色行.}} step:用黄色突出显示单价低于$10.00的行。

我们需要访问GridViewID。Rows[index]访问与索引GridViewID对应的行。行[索引]。单元格[索引]访问某个单元格。但是，当触发行数据绑定事件时，GridViewRow不会添加到Rows集合中，因此我们无法在行数据绑定事件处理中传递当前的GridViewRow实例。

相反，我们可以通过e.Row访问它。

e.行。背景色=系统。绘图。颜色。黄色；我们也可以通过cSSClass达到同样的效果(推荐)。

受保护的void highlight cheap products _ RowDataBond(对象发送方，GridViewRowEventArgs e){ //请确保我们使用的是数据行，如果(e . Row . RowType==DatacontrolRowType。DataRow) { //从DataItem属性中获取ProductsRow对象.北风。产品行产品=(北风。产品行()((系统。数据行视图)。划；if(！产品。IsUnitPriceNull()产品。unit price 1000m){ e . row . CSSCclass=' FoundablePriceDefault '；} }}

图11:中所需的行以突出显示的黄色显示。

摘要

在本文中，我们演示了基于数据绑定定制GridView、DetailsView、FormView的方法。为此，我们创建了数据绑定或行数据绑定事件。要访问DetailsView或FormView的数据绑定，我们可以使用DataItem属性。对于GridView，每个GridViewRow实例的DataItem属性包含绑定数据(在RowDataBound事件处理中可用)。

要调整格式，我们可能需要访问特定的行。在GridView和DetailsView中，我们可以通过索引来访问它，而在FormView中，我们需要使用FindControl('controlID ')。同时，FindControl('controlID ')通常可以访问其中一个Web控件Tempeletes。在下一篇文章中，我们将讨论如何在GridView和DetailsView中使用tempeletes，还将讨论其他一些自定义格式的方法。

编程快乐！

作者简介

斯科特米切尔，六本关于ASP/ASP的书的作者。NET，是4GuysFromRolla.com的创始人，自1998年以来一直使用微软的网络技术。Scott是一名独立的技术顾问、培训师和作家，最近完成了一部即将由Sams出版社出版的新作，24小时内精通ASP.NET 2.0。他的联系电子邮件是[emailprotected]，也可以通过他的博客http://scottonwriting.net/.联系到他