本日我最正 — 亘亘


感謝 vivid 夫婦遠從台中北上探望狗頭兒夫婦,還帶了一位小天使,讓這幾天除了美食之外還有滿滿快樂的回憶 ^o^

[整理]如何顯示標題列於無資料的 GridView

如同 Kevin Marshall 所說的,使用 ASP.NET 中的 GridView 時,當你所繫結(binding)的來源是沒有資料的時候,GridView 會整個不見,也不會出現原本的 Header 或是 Footer,使用上非常的不便...以往便宜行事的作法先彈出一個 alert message,接著把 GridView 不顯示,實在是有點鳥...即便 GridView 裡面有 EmptyDataTemplate 可以先設定好沒有資料的時候要顯示何種資訊,但不能動態設定顯示和關閉...上述方式都有其缺陷。

歸納一下許多高手前輩的分享文,主要是透過繼承並擴展原有的 GridView 類別,新增相關控制的屬性(i.e. Header or Footer),接著覆寫(override) CreateChildControls Method 來建立對應輸出的表格。

以下是相關的文章:

  1. Kevin Marshall: Displaying GridView When No Data Exists
    根據發表日期和 Matt Berseth 在文中的引用說明,這一篇個人認為是原創文,裡面的概念寫的很清楚,很有參考價值。
  2. Matt Berseth: How To: Show Header and Footer Rows in an Empty GridView
    這篇文章中引用了 Kevin Marshall 的片段程式並加以改寫後,並且新增控制 Header 和 Footer 是否顯示的屬性。
  3. ASP.NET 魔法學院: 擴展 GridView 控制項 - 無資料時顯示標題列
    中文參考資料,以 VB.NET 撰寫。

其實看了上面的文章應該就能實做出來了,若還有需要可以參考以下的 Setp-by-Setp。

1. Add New Class.
首先新增一個類別,例如名為: EmptyGridView,接著你會發現 ASP.NET 中的 App_Code 資料夾裡面有一個 EmptyGridView.cs。

2. Set Namespace & Code.
接著為了引用的方便,我把 namespace 設定為 EmptyGridView,並設定該類別繼承自 GridView,最後貼上 Matt Berseth 文中的 code 即可。如以下所示:


namespace EmptyGridView
{
    public class EmptyGridView : GridView
    {
      // Copy Matt Berseth code here.
    }
}

3. Register the class.
接著在 ASP.NET 的頁面中,註冊這個 class。
<%@ Register TagPrefix="Custom" Namespace="EmptyGridView" %>

4. GridVew property.
最後在 GridView 中去設定相關的屬性(顯示/不顯示/文字)就可以了。最後在 Postback 的 Event 中,也能透過設定來動態控制。
<Custom:EmptyGridView ID="gv" runat="server" AutoGenerateColumns="false" ShowHeader="true" ShowHeaderWhenEmpty="true" EmptyDataText="沒有符合查詢條件的資料。">

最後是一些程式中不熟悉的地方的話,可以參考下列的文章: