在完成了應(yīng)用程序架構(gòu)和頁(yè)面的設(shè)計(jì)后，我們可以開(kāi)始探討如何實(shí)現(xiàn)多種多樣的普通數(shù)據(jù)到報(bào)表展現(xiàn)的任務(wù)。前面我們已經(jīng)了解到如何在從數(shù)據(jù)訪(fǎng)問(wèn)層和業(yè)務(wù)邏輯層綁定數(shù)據(jù)到ASP.NET頁(yè)面上的數(shù)據(jù)控件。在ASP.NET 1.x應(yīng)用程序中，通過(guò)對(duì)數(shù)據(jù)控件的DataSource屬性賦值然后調(diào)用控件的DataBind()方法從而實(shí)現(xiàn)數(shù)據(jù)展現(xiàn)的方式在ASP.NET 2.0應(yīng)用程序中可以繼續(xù)使用。然而，ASP.NET 2.0的數(shù)據(jù)源控件提供了一種新的方式，使用這些控件可以讓你輕松從上文中創(chuàng)建的業(yè)務(wù)邏輯層中進(jìn)行數(shù)據(jù)綁定，甚至不需要手寫(xiě)一行的代碼。

　　ASP.NET 2.0提供了五種內(nèi)置的數(shù)據(jù)源控件：SqlDataSource、AccessDataSource,、ObjectDataSource、XmlDataSource、和SiteMapDataSource，盡管如果有需要的話(huà)你還可以構(gòu)建自己的自定義數(shù)據(jù)源控件（custom data source controls）。既然我們?cè)谇拔闹幸呀?jīng)完成了應(yīng)用程序示例的系統(tǒng)架構(gòu)，基于已有的業(yè)務(wù)邏輯類(lèi)我們將使用ObjectDataSource。

圖1: ASP.NET 2.0包括五種內(nèi)置的數(shù)據(jù)源控件

　　ObjectDataSource充當(dāng)別的對(duì)象的代理。通過(guò)配置ObjectDataSource，我們指定這些底層的對(duì)象，還有這些對(duì)象的方法如何映射到ObjectDataSource的Select、Insert、Update和Delete方法。一旦底層的對(duì)象被指定并且其方法映射到ObjectDataSource的方法后，我們就可以把ObjectDataSource綁定到頁(yè)面上的Data Web 服務(wù)器控件。ASP.NET提供了許多Data Web 服務(wù)器控件，包括GridView、DetailsView、RadioButtonList和DropDownList等等。在頁(yè)面的生命周期中，Data Web 服務(wù)器控件可能需要訪(fǎng)問(wèn)它所綁定的數(shù)據(jù)，這將通過(guò)調(diào)用ObjectDataSource的Select方法來(lái)實(shí)現(xiàn)；如果這個(gè)Data Web 服務(wù)器控件還支持插入、更新或者刪除，那么將調(diào)用ObjectDataSource的Insert、Update或者Delete方法。這些調(diào)用會(huì)通過(guò)ObjectDataSource被發(fā)送到適當(dāng)?shù)牡讓訉?duì)象的方法，如下圖所示。

圖2:ObjectDataSource充當(dāng)一個(gè)代理

　　雖然ObjectDataSource被用來(lái)實(shí)現(xiàn)插入、更新或者刪除數(shù)據(jù)，但暫時(shí)我們只集中討論返回?cái)?shù)據(jù)，以后的章節(jié)再探討使用ObjectDataSource和Data Web 服務(wù)器控件實(shí)現(xiàn)數(shù)據(jù)修改。

第一步：添加和配置ObjectDataSource控件

　　首先，打開(kāi)BasicReporting文件夾中的SimpleDisplay.aspx頁(yè)面，切換到設(shè)計(jì)視圖，從工具箱拖拽一個(gè)ObjectDataSource控件到頁(yè)面。它在設(shè)計(jì)界面顯示為一個(gè)灰色的方塊，這是因?yàn)樗划a(chǎn)生任何的聲明標(biāo)記；它僅僅是通過(guò)調(diào)用制定的對(duì)象的方法存取數(shù)據(jù)。通過(guò)ObjectDataSource返回的數(shù)據(jù)可以展現(xiàn)到Data Web 服務(wù)器控件，例如GridView、DetailsView、FormView等等。

　　注意：作為另一種選擇，你也可以先在頁(yè)面上添加一個(gè)Data Web 服務(wù)器控件，然后“顯示智能標(biāo)記”，從“選擇數(shù)據(jù)源”下拉框中選擇〈新建數(shù)據(jù)源…〉進(jìn)入數(shù)據(jù)源配置向?qū)?lái)添加一個(gè)ObjectDataSource。

　　為了指定ObjectDataSource的底層對(duì)象并且把該對(duì)象的方法映射到ObjectDataSource的的方法，可以點(diǎn)擊ObjectDataSource的智能標(biāo)記中的“配置數(shù)據(jù)源”鏈接進(jìn)入數(shù)據(jù)源配置向?qū)А?/p>

圖3: 點(diǎn)擊智能標(biāo)記中的“配置數(shù)據(jù)源”鏈接

　　這將進(jìn)入數(shù)據(jù)源配置向?qū)?。首先，我們需要給ObjectDataSource指定一個(gè)業(yè)務(wù)對(duì)象。如果勾選上“只顯示數(shù)據(jù)組件”，那么下拉框中就僅僅顯示出那些以[DataObject]特征修飾過(guò)的對(duì)象。當(dāng)前這個(gè)列表中應(yīng)該包含了類(lèi)型化數(shù)據(jù)集中表適配器對(duì)象（TableAdapters）和前文中我們已經(jīng)創(chuàng)建的業(yè)務(wù)對(duì)象。如果你忘了給業(yè)務(wù)邏輯類(lèi)增加[DataObject]特征，那么當(dāng)前列表中講看不到它們。如果是那樣的話(huà)，你也可以不勾選“只顯示數(shù)據(jù)組件”從而看見(jiàn)所有對(duì)象，這就可以把業(yè)務(wù)對(duì)象包含進(jìn)來(lái)（連同類(lèi)型化數(shù)據(jù)集中的其他類(lèi) –DataTables、 DataRows等等）

　　在第一屏中從下拉列表中選擇業(yè)務(wù)對(duì)象ProductsBLL ，然后點(diǎn)擊“下一步”。

圖4: 指定ObjectDataSource 控件使用的業(yè)務(wù)對(duì)象

　　在下一屏中向?qū)е心憧梢赃x擇ObjectDataSource要調(diào)用的方法。下拉列表中方法是從上一屏中選定的業(yè)務(wù)對(duì)象獲得的。這里我們可以看到GetProductsByProductID，GetProducts，GetProductsByCategoryID和GetProductsBySupplierID這幾個(gè)方法。從下拉列表中選擇方法GetProducts然后點(diǎn)擊“完成”（如果你已經(jīng)像前文展示那樣給ProductBLL的方法增加了[DataObjectMethod]特征，那么該項(xiàng)會(huì)被默認(rèn)選中）。

圖5: 從“Select”Tab頁(yè)選擇返回?cái)?shù)據(jù)的方法

　　手工配置ObjectDataSource

ObjectDataSource配置向?qū)峁┝艘粋€(gè)快捷的方式來(lái)指定它使用的對(duì)象并關(guān)聯(lián)需要調(diào)用的方法。不過(guò)，你也可以通過(guò)它的屬性來(lái)配置ObjectDataSource，不管是通過(guò)屬性窗口還是直接在聲明標(biāo)記里。只需簡(jiǎn)單地將TypeName屬性設(shè)置為使用的業(yè)務(wù)對(duì)象的名稱(chēng)，將SelectMethod屬性設(shè)置為提取數(shù)據(jù)時(shí)需要調(diào)用的方法名稱(chēng)。

 asp:ObjectDataSource ID="ObjectDataSource1" runat="server"

  SelectMethod="GetProducts"

  TypeName="ProductsBLL">

/asp:ObjectDataSource>

　　盡管你可能更喜歡數(shù)據(jù)源配置向?qū)В袝r(shí)你還是需要手工配置ObjectDataSource，因?yàn)榕渲孟驅(qū)е涣谐鲆呀?jīng)開(kāi)發(fā)的類(lèi)。如果你希望把ObjectDataSource綁定到.NET Framework里的類(lèi)–例如 Membership class來(lái)存取登陸用戶(hù)信息，或者Directory class 來(lái)管理文件系統(tǒng)信息，那么你就需要手工設(shè)置ObjectDataSource的屬性。

第二步:添加一個(gè)Data Web服務(wù)器控件并將它綁定到ObjectDataSource

　　在ObjectDataSource添加到頁(yè)面并完成配置之后，我們就可以添加一個(gè)Data Web服務(wù)器控件到頁(yè)面來(lái)展現(xiàn)通過(guò)ObjectDataSource的Select方法返回的數(shù)據(jù)。所有的Data Web服務(wù)器控件都可以綁定到ObjectDataSource；下面我們看看如何將ObjectDataSource的數(shù)據(jù)展現(xiàn)到GridView、DetailsView、和 FormView 。

綁定一個(gè)GridView到ObjectDataSource

　　從工具箱添加一個(gè)GridView控件到頁(yè)面SimpleDisplay.aspx的設(shè)計(jì)界面。從GridView的智能標(biāo)記，選擇我們?cè)诘谝徊街刑砑拥腛bjectDataSource控件作為數(shù)據(jù)源。這將根據(jù)ObjectDataSource的Select方法所返回?cái)?shù)據(jù)的每一個(gè)屬性（即類(lèi)型化數(shù)據(jù)集Products所定義的屬性）自動(dòng)地在GridView控件里產(chǎn)生一個(gè)綁定列（BoundField）。

圖6: 添加一個(gè)GridView控件到頁(yè)面并綁定到ObjectDataSource

圖7: 通過(guò)編輯列對(duì)話(huà)框管理GridView控件的綁定列

 花一些時(shí)間修改GridView控件的綁定列，移除ProductID, SupplierID, CategoryID, QuantityPerUnit, UnitsInStock, UnitsOnOrder, 和 ReorderLevel這幾列。操作很簡(jiǎn)單，從左下方的列表中選中這些列然后點(diǎn)擊刪除按鈕（紅色交叉）就可以移除它們。然后，重新排列一下，選中CategoryName 和 SupplierName兩個(gè)綁定列并點(diǎn)擊向上箭頭按鈕，使它們排放在UnitPrice列之前。分別設(shè)置Products、Category、Supplier和 Price這幾個(gè)剩下的綁定列的HeaderText屬性。然后，格式化Price列為貨幣–設(shè)置該綁定列的HtmlEncode屬性為False并且設(shè)置DataFormatString屬性為{0:c} 。最后，通過(guò)ItemStyle/HorizontalAlign屬性設(shè)置綁定列Price的水平靠右對(duì)齊以及CheckBox列Discontinued水平居中顯示。

 asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1" EnableViewState="False">

 Columns>

  asp:BoundField DataField="ProductName" HeaderText="Product" SortExpression="ProductName" />

  asp:BoundField DataField="CategoryName" HeaderText="Category" ReadOnly="True" SortExpression="CategoryName" />

  asp:BoundField DataField="SupplierName" HeaderText="Supplier" ReadOnly="True" SortExpression="SupplierName" />

  asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}" HeaderText="Price"

   HtmlEncode="False" SortExpression="UnitPrice">

   ItemStyle HorizontalAlign="Right" />

  /asp:BoundField>

  asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued" SortExpression="Discontinued">

   ItemStyle HorizontalAlign="Center" />

  /asp:CheckBoxField>

 /Columns>

/asp:GridView>

圖 8: GridView控件的綁定列定制完成

使用主題（Themes）保持顯示風(fēng)格的一致

　　這里會(huì)盡可能地移除控件層面的樣式設(shè)置，取而代之的是使用在一個(gè)外部文件里定義的級(jí)聯(lián)樣式表。文件Styles.css包含了DataWebControlStyle、HeaderStyle、RowStyle和 AlternatingRowStyle 這幾種CSS樣式可以用來(lái)指示Data Web服務(wù)器控件的外觀(guān)。為了實(shí)現(xiàn)這一點(diǎn)，我們可以設(shè)置GridView控件的CssClass屬性為DataWebControlStyle，HeaderStyle、RowStyle和 AlternatingRowStyle的CssClass屬性也類(lèi)似地設(shè)置。

　　如果我們?cè)O(shè)置了這些CssClass屬性到Web控件，那么我們不得不記得明確地把每一個(gè)屬性的值和每一個(gè)Data Web服務(wù)器控件記錄到我們的手冊(cè)中。一種更為方便管理的方法是使用一個(gè)Theme定義CSS樣式跟GridView、 DetailsView和FormView控件的屬性之間的關(guān)聯(lián)關(guān)系。Theme是一個(gè)控件層面的屬性設(shè)置、圖片和CSS樣式的集合，它可以應(yīng)用到整個(gè)站點(diǎn)的所有頁(yè)面強(qiáng)制約束外貌和感觀(guān)。

　　我們的Theme將不會(huì)包含圖片和CSS文件（我們會(huì)把stylesheet Styles.css文件照舊留在web應(yīng)用程序的根目錄下），但是它會(huì)包含兩個(gè)外觀(guān)（Skin）。外觀(guān)是一個(gè)包含Web控件的默認(rèn)屬性設(shè)置的文件。特別地，我們將創(chuàng)建一個(gè)Skin文件為GridView和 DetailsView定義外觀(guān)，標(biāo)示默認(rèn)的CssClass關(guān)聯(lián)的屬性。

　　在解決方案資源管理器里選中當(dāng)前項(xiàng)目，從右鍵菜單中選擇“添加新項(xiàng)”，添加一個(gè)外觀(guān)文件到你的項(xiàng)目并命名為GridView.skin 。

圖9: 添加一個(gè)外觀(guān)文件并命名為GridView.skin

　　Skin files need to be placed in a Theme, which are located in the App_Themes folder. Since we don't yet have such a folder, Visual Studio will kindly offer to create one for us when adding our first Skin. Click Yes to create the App_Theme folder and place the new GridView.skin file there.

　　外觀(guān)文件需要被放置到一個(gè)主題里，而主題文件則存放在App_Themes文件夾里。因?yàn)槲覀兡壳斑€沒(méi)有這個(gè)文件夾，當(dāng)我們添加第一個(gè)外觀(guān)文件時(shí)，Visual Studio會(huì)友善地提議為我們創(chuàng)建一個(gè)。點(diǎn)擊“是”，自動(dòng)創(chuàng)建App_Theme文件夾并把剛剛添加的GridView.skin文件放置在那里。

圖 10: 讓Visual Studio自動(dòng)創(chuàng)建App_Theme文件夾

 這將在App_Themes文件夾中自動(dòng)創(chuàng)建一個(gè)主題，主題名稱(chēng)為GridView并包含了外觀(guān)文件GridView.skin 。

圖 11: 主題GridView已被添加到 App_Theme 文件夾

　　把主題GridView重命名為DataWebControls（從GridView文件夾右鍵菜單中選擇重命名）。然后，進(jìn)入下面所見(jiàn)的GridView.skin文件的標(biāo)記：

asp:GridView runat="server" CssClass="DataWebControlStyle">

 AlternatingRowStyle CssClass="AlternatingRowStyle" />

 RowStyle CssClass="RowStyle" />

 HeaderStyle CssClass="HeaderStyle" /> 

/asp:GridView>

　　使用了主題DataWebControls后，這將定義任何一個(gè)頁(yè)面中任何一個(gè)GridView控件與CssClass相關(guān)屬性的默認(rèn)值。讓我們添加一個(gè)另一個(gè)針對(duì)DetailsView控件的外觀(guān)，這個(gè)控件我們不久就會(huì)用到。在主題DataWebControls添加一個(gè)命名為DetailsView.skin的外觀(guān)，并加入如下的標(biāo)記：

asp:DetailsView runat="server" CssClass="DataWebControlStyle">

 AlternatingRowStyle CssClass="AlternatingRowStyle" />

 RowStyle CssClass="RowStyle" />

 FieldHeaderStyle CssClass="HeaderStyle" />

/asp:DetailsView>

　　關(guān)于我們的主題設(shè)置，最后一部就是將主題應(yīng)用到我們的ASP.NET頁(yè)面。一個(gè)主題可以一頁(yè)一頁(yè)地應(yīng)用到頁(yè)面，也可以應(yīng)用到一個(gè)站點(diǎn)下的所有頁(yè)面。讓我們把主題應(yīng)用到站點(diǎn)下的所有頁(yè)面。為了實(shí)現(xiàn)這一點(diǎn)，在Web.config的system.web>片斷里加入下面的標(biāo)記：

 pages styleSheetTheme="DataWebControls" />

　　這就順利完成了！在主題樣式表里預(yù)設(shè)的屬性將不會(huì)覆蓋直接在控件層面設(shè)定的屬性。如果希望主題里的設(shè)置高于控件的設(shè)置，則需要在主題樣式表里使用主題特征；然而不幸地，主題特征的設(shè)置并不出現(xiàn)在Visual Studio 的邏輯視圖。查閱 ASP.NET Themes and Skins Overview 和 Server-Side Styles Using Themes 獲取更多的關(guān)于主題和外觀(guān)的信息； 查看 How To: Apply ASP.NET Themes 獲得更多的關(guān)于如何配置頁(yè)面去使用一個(gè)主題的信息。

圖 12: The GridView顯示 Product's Name, Category, Supplier, Price, and Discontinued Information

在 DetailsView控件里每次顯示一條數(shù)據(jù)

　　在GridView控件里，從綁定的數(shù)據(jù)源控件返回的數(shù)據(jù)每條記錄會(huì)被顯示為一行。然而有時(shí)候，我們僅僅需要顯示一條單獨(dú)的記錄，或者每次只顯示一條記錄。DetailsView控件提供了這個(gè)功能，它表現(xiàn)為一個(gè)兩列的HTML的table>，每一行顯示一個(gè)字段或者一個(gè)屬性。你可以想象DetailsView是只有一條數(shù)據(jù)的GridView翻轉(zhuǎn)90度。

　　首先，在頁(yè)面SimpleDisplay.aspx里GridView控件的上方添加一個(gè)DetailsView控件。然后，把它綁定到GridView的同一個(gè)ObjectDataSourc控件。正如GridView控件那樣，它會(huì)根據(jù)ObjectDataSource的Select方法所返回的數(shù)據(jù)，每一個(gè)屬性生成一個(gè)綁定列。唯一不同的是，DetailsView的綁定列是水平排列的。

圖 13: 添加一個(gè)DetailsView 控件到頁(yè)面并綁定到ObjectDataSource

類(lèi)似GridView，DetailsView的綁定列也可以調(diào)整提供一些用戶(hù)化的展現(xiàn)。圖14展示了DetailsView控件在設(shè)置好綁定列和CssClass屬性后使它的外觀(guān)類(lèi)似于GridView的例子。

圖 14: DetailsView 控件顯示一條記錄

注意DetailsView控件只顯示它的數(shù)據(jù)源里的第一條記錄。為了讓用戶(hù)可以瀏覽所有記錄，我們必須允許DetailsView分頁(yè)。為了實(shí)現(xiàn)這個(gè)，回到Visual Studio，在DetailsView的智能標(biāo)記中勾選上“啟用分頁(yè)”。

圖 15: 允許DetailsView 控件分頁(yè)

圖 16: 啟用分頁(yè)后，DetailsView控件允許用戶(hù)查看任何一個(gè)Products

以后的教程中中我們將詳細(xì)討論關(guān)于分頁(yè)。

一種更靈活的排版用作每次顯示一條記錄

　　使用DetailView展現(xiàn)ObjectDataSource返回的每一條數(shù)據(jù)顯得有些呆板。我們可能會(huì)需要更靈活的數(shù)據(jù)展現(xiàn)方式。例如，在每一個(gè)單獨(dú)的行里，在顯示product's name, category, supplier, price, 和 discontinued information這些信息的基礎(chǔ)上，我們可能需要product name 和 price兩列顯示h4>的列頭，而category 和 supplier則以較小的字體顯示在name和price下方。另外，我們也許不太在意屬性名（Product, Category,等等）顯示在屬性值后面。

　　FormView控件提供了這個(gè)層面的用戶(hù)化定制。在使用字段的基礎(chǔ)上(像GridView 和 DetailsView那樣)，F(xiàn)ormView控件使用模版，這可以讓我們混合使用Web服務(wù)器控件，靜態(tài)的HTML和綁定語(yǔ)法（databinding syntax）。如果你熟悉ASP.NET 1.x中的Repeater控件，你可以認(rèn)為FormView是只顯示一條記錄的Repeater 。

　　在頁(yè)面SimpleDisplay.aspx的設(shè)計(jì)界面添加一個(gè)FormView控件。一開(kāi)始FromView控件顯示為一個(gè)灰色的方塊，并告知我們需要編輯模版內(nèi)容，需要使用ItemTemplate 。

圖 17: FormView必須包含一個(gè)ItemTemplate

　　你可以通過(guò)FormView的智能標(biāo)記直接給它綁定一個(gè)數(shù)據(jù)源控件，這將自動(dòng)創(chuàng)建一個(gè)默認(rèn)的ItemTemplate（如果ObjectDataSource設(shè)置了InsertMethod 和 UpdateMethod，那么同時(shí)也會(huì)自動(dòng)創(chuàng)建EditItemTemplate 和 InsertItemTemplate）。不過(guò)，這里的示例我們將手工綁定FormView并設(shè)置其ItemTemplate 。首先，設(shè)置FormView的DataSourceID屬性為ObjectDataSource的ID： ObjectDataSource1，然后，創(chuàng)建ItemTemplate，在一個(gè)h4>里顯示product's name 和 price，category 和 supplier則以較小的字體顯示在下方。

 asp:FormView ID="FormView1" runat="server" DataSourceID="ObjectDataSource1" EnableViewState="False">

 ItemTemplate>

  h4>%# Eval("ProductName") %> (%# Eval("UnitPrice", "{0:c}") %>)/h4>

  Category: %# Eval("CategoryName") %>; Supplier: %# Eval("SupplierName") %>

 /ItemTemplate>

/asp:FormView>

圖 18: 第一個(gè)產(chǎn)品 (Chai) 顯示為預(yù)定的格式

 %# Eval(propertyName) %>是綁定語(yǔ)法。方法Eval返回綁定到FormView的對(duì)象的指定屬性的值。查閱Alex Homer的文章Simplified and Extended Data Binding Syntax in ASP.NET 2.0獲取更多的關(guān)于數(shù)據(jù)綁定的細(xì)節(jié)。

　　跟DetailsView一樣，F(xiàn)ormView置顯示ObjectDataSource返回的第一條記錄。你可以啟用FormView的分頁(yè)功能，從而讓訪(fǎng)問(wèn)者可以依次查看每個(gè)產(chǎn)品。

總結(jié)

　　有賴(lài)于ASP.NET 2.0的ObjectDataSource控件，我們可以方便地完成從業(yè)務(wù)邏輯層獲取和展現(xiàn)數(shù)據(jù)而不需要寫(xiě)一行代碼。OjbectDataSource調(diào)用指定的類(lèi)的方法并且返回結(jié)果。這些結(jié)果可以展現(xiàn)在綁定了ObjectDataSource的Data Web服務(wù)器控件。本章節(jié)我們看了如何綁定到GridView、DetailsView、和FormView 控件到ObjectDataSource 。

　　到目前為止我們僅僅看了如何使用OjbectDataSource調(diào)用一個(gè)沒(méi)有參數(shù)的方法，但如果我們想調(diào)用一個(gè)需要傳入多個(gè)參數(shù)的方法，例如類(lèi)ProductBLL里的GetProductsByCategoryID(categoryID)方法呢？為了調(diào)用需要傳入一個(gè)或多個(gè)參數(shù)的方法，我們需要配置ObjectDataSource指定這些參數(shù)的值。在下一章中我們來(lái)看看如何實(shí)現(xiàn)。

 祝編程快樂(lè)！

作者簡(jiǎn)介

Scott Mitchell，著有六本ASP/ASP.NET方面的書(shū)，是4GuysFromRolla.com的創(chuàng)始人，自1998年以來(lái)一直應(yīng)用微軟Web技術(shù)。Scott是個(gè)獨(dú)立的技 術(shù)咨詢(xún)顧問(wèn)，培訓(xùn)師，作家，最近完成了將由Sams出版社出版的新作，24小時(shí)內(nèi)精通ASP.NET 2.0。他的聯(lián)系電郵為mitchell@4guysfromrolla.com，也可以通過(guò)他的博客http://ScottOnWriting.NET與他聯(lián)系。