在ASP.NET 2.0中如何配置GridView頁腳顯示統(tǒng)計信息

這篇文章給大家分享的是有關(guān)在ASP.NET 2.0中如何配置GridView頁腳顯示統(tǒng)計信息的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

導言

　　除了需要了解產(chǎn)品的單價、庫存量和訂貨量，并按等級排序之外，用戶可能還對統(tǒng)計信息感興趣，比如說平均價格、庫存總量等等。這些統(tǒng)計信息常常顯示在報表最下面的一個統(tǒng)計行中。GridView控件可以含有一個頁腳行，我們可以通過編程將統(tǒng)計數(shù)據(jù)插入到它的單元格里面去。這個任務給了我們以下3個挑戰(zhàn)：

1.配置GridView以顯示它的頁腳行

2.確定統(tǒng)計數(shù)據(jù)。即我們應該如何計算平均價格還有庫存總量？

3.將統(tǒng)計信息插入到頁腳行的相應的單元格中

　　在本節(jié)教程中，我們將會看到如何去征服這些挑戰(zhàn)。另外呢，我們將創(chuàng)建一個頁面，它含有一個列出所有“類別”的下拉框，選擇一個“類別”就可以在GridView中顯示這個類別的產(chǎn)品。GridView中包含一個頁腳行，用于顯示此類產(chǎn)品的平均價格、庫存總量和訂貨總量。

圖一：統(tǒng)計信息顯示在GridView的頁腳行中

　　由于含有“類別”到“產(chǎn)品”的主/從界面，所有本節(jié)是建立在前面的“使用DropDownList進行主/從過濾”節(jié)中所討論的那些概念的基礎(chǔ)上的。如果你還沒有看過那一節(jié)的話，在繼續(xù)本節(jié)的學習之前，還是去看看比較好。

第一節(jié)：添加“類別”下拉框和“產(chǎn)品”GridView

　　往GridView中添加頁腳行之前，讓我們先來簡單的建立一個主/從報表。一旦我們完成了這第一步的工作，我們就可以來看看如何加入統(tǒng)計數(shù)據(jù)了。

　　首先打開CustomFormatting文件夾中的SummaryDataInFooter.aspx頁面。添加一個DropDownList控件，并將其ID設(shè)置為Categories。然后，在這個DropDownList的智能標簽上點擊“選擇數(shù)據(jù)源（Choose Data Source）”，添加一個新的調(diào)用CategoriesBLL類的GetCategories ()方法的ObjectDataSource控件，將這個ObjectDataSource命名為CategoriesDataSource。

圖二：添加一個新的名為CategoriesDataSource的ObjectDataSource控件

圖三：使這個ObjectDataSource控件調(diào)用CategoriesBLL類的GetCategories ()方法

　　再配置了了ObjectDataSource之后，向?qū)⑽覀兎祷氐紻ropDownList的數(shù)據(jù)源配置向?qū)抢?，在這兒我們可以指定哪個字段需要顯示以及哪個字段應該作為DropDownList的ListItem的值。我們將CategoryName字段拿來顯示，而把CategoryID拿來作為值。

圖四：分別使用CategoryName和CategoryID來作為ListItem的文本和值

　　現(xiàn)在，我們便在系統(tǒng)中有了一個能列出類別的DropDownList了?，F(xiàn)在我們需要添加一個根據(jù)所選的類別來列出產(chǎn)品的GridView。不過，在此之前，讓我們先花點時間到DropDownList的智能標簽中勾上“啟用自動回發(fā)（Enable AutoPostBack）”復選框。我們在前面的“使用DropDownList進行主/從過濾 lidong6”節(jié)中討論過，在將DropDownList的AutoPostBack屬性設(shè)置為true之后，只要DropDownList的值發(fā)生了變化，頁面就會回發(fā)。這樣就可以刷新GridView以顯示新選擇的類別的產(chǎn)品了。如果AutoPostBack屬性設(shè)置為false（默認值），改變類別將不會導致回發(fā)，因此也就不能刷新產(chǎn)品列表了。

圖五：在DropDownList的智能標簽中勾上“啟用自動回發(fā)”復選框

　　添加一個GridView控件到頁面上以便可以根據(jù)選定的類別來顯示產(chǎn)品。將這個GridView的ID設(shè)置為ProductsInCategory，并將其綁定到一個新的名為ProductsInCategoryDataSource的ObjectDataSource上。

圖六：添加一個新的名為ProductsInCategoryDataSource的ObjectDataSource

配置這個ObjectDataSource，以使其調(diào)用ProductsBLL類的GetProductsByCategoryID(categoryID)方法。

圖七：使這個ObjectDataSource調(diào)用GetProductsByCategoryID(categoryID)方法

　　由于GetProductsByCategoryID(categoryID)方法需要一個參數(shù)，所以在向?qū)У淖詈笠徊嚼铮覀兛梢灾付▍?shù)值的數(shù)據(jù)源。為了根據(jù)顯示所選的類別來顯示產(chǎn)品，這個參數(shù)應該從Categories下拉框中獲取。

圖八：從Catefories下拉框中獲取categoryID參數(shù)

　　完成了向?qū)е螅@個GridView將會包含一些對應于產(chǎn)品的每一個屬性的BoundField。讓我們來清理一下這些BoundField，剩下要顯示的ProductName、UnitPrice、UnitsInStock以及UnitsOnOrder就可以了。然后你可以隨便的給剩下的這些BoundField添加一些字段級的設(shè)置（比如說將UnitPrice格式化為貨幣形式）。做了這些更改之后，這個GridView的聲明標記應該是這個樣子：

<asp:GridView ID="ProductsInCategory" runat="server"
  AutoGenerateColumns="False" DataKeyNames="ProductID"
  DataSourceID="ProductsInCategoryDataSource" EnableViewState="False">
  <Columns>
    <asp:BoundField DataField="ProductName" HeaderText="Product"
     SortExpression="ProductName" />
    <asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}"
      HeaderText="Price"
      HtmlEncode="False" SortExpression="UnitPrice">
      <ItemStyle HorizontalAlign="Right" />
    </asp:BoundField>
    <asp:BoundField DataField="UnitsInStock"
     HeaderText="Units In Stock" SortExpression="UnitsInStock">
      <ItemStyle HorizontalAlign="Right" />
    </asp:BoundField>
    <asp:BoundField DataField="UnitsOnOrder"
      HeaderText="Units On Order" SortExpression="UnitsOnOrder">
      <ItemStyle HorizontalAlign="Right" />
    </asp:BoundField>
  </Columns>
</asp:GridView>

現(xiàn)在，我們就擁有了一個可以根據(jù)所選類別來顯示相關(guān)的產(chǎn)品的名稱、單價、庫存量以及訂貨量的功能齊全的主/從報表了。

圖九：現(xiàn)在的效果（譯者注：估計原文這里弄錯了，寫得跟圖八的一樣。這里的原文是“Figure 9: Get the categoryID Parameter Value from the Selected Categories DropDownList”，圖八的原文是“Figure 8: Get the categoryID Parameter Value from the Selected Categories DropDownList”）

第二步：在GridView中顯示頁腳

　　GridView控件可以顯示頁眉和頁腳行。這些行的顯示與否分別取決于ShowHeader和ShowFooter屬性，默認情況下，ShowHeader的值為true，而ShowFooter的值為false。要顯示頁腳行的話，我們只需簡單的將ShowFooter屬性設(shè)置為true就可以了。

圖十：將GridView的ShowFooter屬性設(shè)置為true

　　GridView中所定義的每一個字段都在頁腳行中有一個對應的單元格，不過這些單元格默認是空的?；c時間到瀏覽器中看看我們的成果。由于我們將GridView的ShowFooter屬性設(shè)置為true了，所以GridView現(xiàn)在包含了一個空的頁腳行。

圖十一：現(xiàn)在，GridView有了一個頁腳行

　　圖十一中的頁腳行并不明顯，因為它的背景是白色的。讓我們在Styles.css中創(chuàng)建一個名為FooterStyle的CSS類，用它來指定一個深紅色的背景，并在DataWebControls主題中配置GridView.skin這個皮膚文件（Skin file）以將此CSS類分配給此GridView的FooterStyle的CssClass屬性。如果你需要復習一下皮膚和主題的相關(guān)內(nèi)容，請參考“使用ObjectDataSource顯示數(shù)據(jù)”。

先給Styles.css添加以下的CSS類：

.FooterStyle
{
  background-color: #a33;
  color: White;
  text-align: right;
}

　　FooterStyle這個CSS類跟HeaderStyle類是一樣的，只是HeaderStyle的背景色要深一點且文本是粗體顯示的而已。此外，頁腳的文本是右對齊的，而頁眉的文本是居中的。然后，為了將這個CSS類關(guān)聯(lián)到每一個GridView的頁腳上，在DataWebControls主題中打開GridView.skin文件并設(shè)置FooterStyle的CssClass屬性。作了這個添加之后，文件的標記代碼應該是這個樣子：

<asp:GridView runat="server" CssClass="DataWebControlStyle">
  <AlternatingRowStyle CssClass="AlternatingRowStyle" />
  <RowStyle CssClass="RowStyle" />
  <HeaderStyle CssClass="HeaderStyle" />
  <FooterStyle CssClass="FooterStyle" />
  <SelectedRowStyle CssClass="SelectedRowStyle" />
</asp:GridView>

就像下面這個屏幕截圖所顯示的那樣，這個更改使頁腳清晰的顯示出來了。

圖十二：GridView的頁腳現(xiàn)在有了一個紅紅的背景色

第三步：計算統(tǒng)計數(shù)據(jù)

在顯示了GridView的頁腳之后，下一個面對我們的挑戰(zhàn)就是如何計算統(tǒng)計數(shù)據(jù)。有兩個計算統(tǒng)計信息的途徑：

1.通過一個SQL查詢——我們可以向數(shù)據(jù)庫發(fā)出一個額外的查詢來為某個特定的類別計算統(tǒng)計信息。SQL包含一系列的聚合函數(shù)，并由GROUP BY子句指定應該根據(jù)什么數(shù)據(jù)來進行統(tǒng)計。下面的SQL查詢將會返回我們所需要的信息：

SELECT CategoryID, AVG(UnitPrice), SUM(UnitsInStock), SUM(UnitsOnOrder)
FROM Products
WHERE CategoryID = categoryID
GROUP BY CategoryID

當然，你也可能不喜歡直接在SummaryDataInFooter.aspx頁面中直接執(zhí)行這個查詢，而是希望在ProductsTableAdapter 和ProductsBLL 中創(chuàng)建一個方法來干這個事情。

2.由于這些信息已經(jīng)添加到GridView中了，所以可以直接計算——就像在“基于數(shù)據(jù)的自定義格式化”中討論的那樣，在GridView的數(shù)據(jù)綁定之后，GridView的RowDataBound事件處理方法會在添加每一行數(shù)據(jù)時被執(zhí)行一次。為這個事件創(chuàng)建了事件處理方法之后，我們就可以保持一個累積的合計值了。在最后一行數(shù)據(jù)被綁定到DataGrid上之后，我們就有了一個合計值以及需要計算平均值的信息了。

　　一般來說，我還是喜歡第二種方法的，因為它節(jié)省了一次到數(shù)據(jù)庫的往返，而且要達到這個效果還需要在數(shù)據(jù)訪問層和業(yè)務邏輯層中實現(xiàn)統(tǒng)計功能，不過話說回來了，其實兩種辦法都行的。在這本教程中，我們還是使用第二個辦法吧，并使用RowDataBound事件處理方法來記錄這個累積合計。

　　給GridView新建一個RowDataBound事件處理方法，你可以在設(shè)計器中選擇GridView，然后在屬性窗口中點擊那個帶閃電符號的圖標，找到RowDataBound事件并雙擊它就可以了。這樣就會在SummaryDataInFooter.aspx頁面的后置代碼類中添加一個新的名為ProductsInCategory_RowDataBound的事件處理方法了。

protected void ProductsInCategory_RowDataBound
  (object sender, GridViewRowEventArgs e)
{
}

為了可以維護一個累積合計，我們需要在這個事件處理方法的外面定義一些變量。創(chuàng)建以下4個頁面級的變量：

·_totalUnitPrice，類型為decimal

·_totalNonNullUnitPriceCount，類型為int

·_totalUnitsInStock，類型為int

·_totalUnitsOnOrder，類型為int

然后，在RowDataBound事件處理方法中寫一些代碼，使每一個數(shù)據(jù)行都可以增加這些變量的值。

// Class-scope, running total variables...
decimal _totalUnitPrice = 0m;
int _totalNonNullUnitPriceCount = 0;
int _totalUnitsInStock = 0;
int _totalUnitsOnOrder = 0;
protected void ProductsInCategory_RowDataBound(object sender,
 GridViewRowEventArgs e)
{
  if (e.Row.RowType == DataControlRowType.DataRow)
  {
    // Reference the ProductsRow via the e.Row.DataItem property
    Northwind.ProductsRow product =
     (Northwind.ProductsRow)
     ((System.Data.DataRowView)e.Row.DataItem).Row;
    // Increment the running totals (if they are not NULL!)
    if (!product.IsUnitPriceNull())
    {
      _totalUnitPrice += product.UnitPrice;
      _totalNonNullUnitPriceCount++;
    }
    if (!product.IsUnitsInStockNull())
      _totalUnitsInStock += product.UnitsInStock;
    if (!product.IsUnitsOnOrderNull())
      _totalUnitsOnOrder += product.UnitsOnOrder;
  }
}

　　在RowDataBound事件處理方法中，我們首先應該確保我們正在操作一個DataRow。一旦確定了是這么回事，e.Row中那個剛剛綁定到GridViewRow對象的Northwind.ProductsRow實例就可以賦值給product變量了。接著，累積合計就被當前產(chǎn)品的相關(guān)值（當然了，我們還是應該要確保它們不會含有一個數(shù)據(jù)庫NULL值）增加了。我們同時記錄了累積的UnitPrice合計以及非空UnitPrice記錄的條數(shù)，因為平均價格是這兩個數(shù)的商。

第四步：在頁腳中顯示統(tǒng)計數(shù)據(jù)

　　計算了統(tǒng)計數(shù)據(jù)之后，最后一個步驟就是在GridView的頁腳上顯示它了。同樣，這個任務也可以通過RowDataBound事件處理方法來完成?；貞浺幌翿owDataBound事件處理方法，它會在每一行綁定到GridView的時候被觸發(fā)，頁腳行也不例外。因此，我們可以擴展我們的事件處理方法，讓它可以通過如下的代碼來在頁腳行中顯示數(shù)據(jù)：

protected void ProductsInCategory_RowDataBound
  (object sender, GridViewRowEventArgs e)
{
  if (e.Row.RowType == DataControlRowType.DataRow)
  {
   ... Increment the running totals ...
  }
  else if (e.Row.RowType == DataControlRowType.Footer)
  {
   ... Display the summary data in the footer ...
  }
}

　　因為頁腳行是在所有的數(shù)據(jù)行都已經(jīng)添加之后才添加到GridView中的，所以我們可以相信在將統(tǒng)計數(shù)據(jù)顯示在頁腳中之前，累積合計值都已經(jīng)計算完畢了。最后一步就是將這些值放到頁腳的單元格中了。

　　要在頁腳的特定單元格中顯示文本，可以使用use e.Row.Cells[index].Text = value，單元格的索引是從0開始的。下面的代碼計算了平均價格（總的價格除以產(chǎn)品的數(shù)量）并將其與庫存量和訂貨量一起顯示到GridView頁腳的相應單元格中。

protected void ProductsInCategory_RowDataBound
  (object sender, GridViewRowEventArgs e)
{
  if (e.Row.RowType == DataControlRowType.DataRow)
  {
   ... <i>Increment the running totals</i> ...
  }
  else if (e.Row.RowType == DataControlRowType.Footer)
  {
   // Determine the average UnitPrice
   decimal avgUnitPrice = _totalUnitPrice / (decimal) _totalNonNullUnitPriceCount;
   // Display the summary data in the appropriate cells
   e.Row.Cells[1].Text = "Avg.: " + avgUnitPrice.ToString("c");
   e.Row.Cells[2].Text = "Total: " + _totalUnitsInStock.ToString();
   e.Row.Cells[3].Text = "Total: " + _totalUnitsOnOrder.ToString();
  }
}

圖十三展示了添加了這段代碼之后這個報表的樣子。注意ToString("c")是如何讓平均價格這個統(tǒng)計信息格式化成貨幣形式的。

圖十三：現(xiàn)在的效果（譯者注：估計原文這里又弄錯了，寫得跟圖十二的一樣。這里的原文是“Figure 13: The GridView's Footer Row Now Has a Reddish Background Color”，圖十二的一樣。這里的原文是“Figure 13: The GridView's Footer Row Now Has a Reddish B的原文是“Figure 12: The GridView's Footer Row Now Has a Reddish Background Color”）

感謝各位的閱讀！關(guān)于“在ASP.NET 2.0中如何配置GridView頁腳顯示統(tǒng)計信息”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！