1．前言
做前幾個項目時,當對 GridView 控件進行數(shù)據(jù)綁定時，如果綁定的記錄為空，網(wǎng)頁上就不顯示 GridView，原來只是簡單的在Gridview的屬性中把 EmptyDataText="Data is empty" 設置一下。感覺還是不理想.下面討論的方法可以讓 GridView 在沒有數(shù)據(jù)記錄的時候顯示表的字段結構和顯示提示信息.(其實看了好多方法大致意思都是一樣的,當數(shù)據(jù)為空時生成一個只有表頭列的空表,然后以生成的表為GridView的數(shù)據(jù)源)
2．數(shù)據(jù)
為了讓 GridView 顯示數(shù)據(jù)，在數(shù)據(jù)庫中建立表 temple，其字段如下：
temple 表示廟宇，它的字段有：
temple_id int
temple_name varchar(50)
location varchar(50)
build_date datetime
temple 的數(shù)據(jù)為：
temple_id | temple_name | location | build_time |
1 | 少林寺 | 河南省登封市嵩山 | 1900-2-2 0:00:00 |
2 | 大杰寺 | 五龍山 | 1933-2-3 3:03:03 |
3 | 法源寺 | 宣武門外教子胡同南端東側 | 1941-2-3 5:04:03 |
4 | 廣濟寺 | 阜成門內大街東口 | 1950-3-3 3:03:03 |
5 | 碧云寺 | 香山東麓 | 1963-3-3 3:03:03 |
3．頁面
建立一個 asp.net 網(wǎng)站工程，在頁面中添加 GridView 和幾個按鈕，代碼如下所示：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>GridView 綁定記錄為空顯示表頭測試</title>
</head>
<body>
<form id="form1" runat="server">
<div style="font-size:13px;">
<asp:GridView ID="GridViewEmptyDataTest" runat="server" AutoGenerateColumns="False" EmptyDataText="Data Is Empty" BackColor="White" BorderColor="LightGray" BorderStyle="Double" BorderWidth="3px"
CellPadding="4" GridLines="Horizontal" Width="500px">
<Columns>
<asp:BoundField DataField="temple_id" HeaderText="temple_id" Visible="False" >
</asp:BoundField>
<asp:BoundField DataField="temple_name" HeaderText="名稱" >
<ItemStyle BorderColor="LightGray" BorderStyle="Double" BorderWidth="1px" Width="100px" />
</asp:BoundField>
<asp:BoundField DataField="location" HeaderText="地址" >
<ItemStyle BorderColor="LightGray" BorderStyle="Double" BorderWidth="1px" Width="300px" />
</asp:BoundField>
<asp:BoundField DataField="build_date" HeaderText="建設時間" >
<ItemStyle BorderColor="LightGray" BorderStyle="Double" BorderWidth="1px" Width="100px" />
</asp:BoundField>
</Columns>
<FooterStyle BackColor="White" ForeColor="#333333" />
<RowStyle BackColor="White" ForeColor="#333333" />
<SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="CornflowerBlue" Font-Bold="True" ForeColor="White" />
</asp:GridView>
<br />
<asp:Button ID="ButtonHasDataBind" runat="server" Text="有數(shù)據(jù)綁定" Width="109px" OnClick="ButtonHasDataBind_Click" />
<asp:Button ID="ButtonQueryEmptyBind" runat="server" Text="查詢結果為空綁定" Width="142px" OnClick="ButtonQueryEmptyBind_Click" />
<asp:Button ID="ButtonConstructTableBind" runat="server" Text="構造空的DataTable綁定" Width="164px" OnClick="ButtonConstructTableBind_Click" />
<asp:Button ID="ButtonNormalBind" runat="server" Text="普通空數(shù)據(jù)綁定" Width="127px" OnClick="ButtonNormalBind_Click" /></div>
</form>
</body>
</html>
GridView 要綁定的字段和 temple 的字段一樣，在這里我們利用 GridView 原有的功能，設定當數(shù)據(jù)為空是顯示“Data Is Empty”，如果沒有設定 EmptyDataText 屬性，當綁定的記錄為空時，GridView 將不在頁面顯示。
4．數(shù)據(jù)顯示
4．1普通空記錄顯示
編寫 ButtonNormalBind 的事件函數(shù) ButtonNormalBind_Click，添加如下代碼，來測試沒有經(jīng)過處理的 GridView 顯示情況：
protected void ButtonNormalBind_Click(object sender, EventArgs e)
{
DataTable dt = new DataTable();
dt.Columns.Add("temple_id");
dt.Columns.Add("temple_name");
dt.Columns.Add("location");
dt.Columns.Add("build_date");
this.GridViewEmptyDataTest.DataSource = dt;
this.GridViewEmptyDataTest.DataBind();
}
執(zhí)行這些代碼后，GridView 顯示結果如下圖所示：
可以看到這樣簡單的提示看不出 GridView 的結構來，在大多數(shù)的實際應用中我們希望看到GridView 到底有哪些字段。
4．2增加空行來顯示 GridView 的結構
我們知道只要 GridView 綁定的 DataTable 有一行記錄，GridView 就會顯示表頭，所以當 DataTable 為空時我們增加一個空行從而顯示表頭。
我們把代碼改成如下所示：
DataTable dt = new DataTable();
dt.Columns.Add("temple_id");
dt.Columns.Add("temple_name");
dt.Columns.Add("location");
dt.Columns.Add("build_date");
if (dt.Rows.Count == 0)
{
dt.Rows.Add(dt.NewRow());
}
this.GridViewEmptyDataTest.DataSource = dt;
this.GridViewEmptyDataTest.DataBind();
在每次綁定前判斷，如果為空就增加一空行，這樣綁定的結果如下圖所示：
可以看得表頭已經(jīng)可以顯示了，但是顯示的空行沒有任何數(shù)據(jù)也讓人費解，可不可以增加一下提示信息呢？
4．3增加空記錄提示
我們在數(shù)據(jù)綁定后增加一些代碼對GridView進行一下處理，讓顯示結果更友好。在this.GridViewEmptyDataTest.DataBind();后面增加代碼如下所示：
int columnCount = dt.Columns.Count;
GridViewEmptyDataTest.Rows[0].Cells.Clear();
GridViewEmptyDataTest.Rows[0].Cells.Add(new TableCell());
GridViewEmptyDataTest.Rows[0].Cells[0].ColumnSpan = columnCount;
GridViewEmptyDataTest.Rows[0].Cells[0].Text = "沒有記錄";
GridViewEmptyDataTest.Rows[0].Cells[0].Style.Add("text-align", "center");
改良后的顯示結果如下圖所示：
看來顯示結果已經(jīng)達到了我們的要求，但是當頁面上有其他按鈕操作導致頁面 PostBack 時，頁面再次顯示確沒有了提示信息變成如下圖所示的樣子：
這并不是我們想要的。
4．4防止 PostBack 時頁面顯示變化
為了防止顯示改變我們在Page_Load事件里添加如下代碼，從而重新綁定GridView：
if (IsPostBack)
{
//如果數(shù)據(jù)為空則重新構造Gridview
if (GridViewEmptyDataTest.Rows.Count == 1 && GridViewEmptyDataTest.Rows[0].Cells[0].Text == "沒有記錄")
{
int columnCount = GridViewEmptyDataTest.Columns.Count;
GridViewEmptyDataTest.Rows[0].Cells.Clear();
GridViewEmptyDataTest.Rows[0].Cells.Add(new TableCell());
GridViewEmptyDataTest.Rows[0].Cells[0].ColumnSpan = columnCount;
GridViewEmptyDataTest.Rows[0].Cells[0].Text = "沒有記錄";
GridViewEmptyDataTest.Rows[0].Cells[0].Style.Add("text-align", "center");
}
}
這下我們的控件終于可以按我們的要求顯示了，但是為了代碼的重用，當一個項目里有多個 GridView 時，避免充分些相同的代碼，我們需要把代碼封裝成類，從而讓所有的 GridView 數(shù)據(jù)綁定時都可以輕易地實現(xiàn)我們的要求。
4．5封裝
類的封裝代碼如下所示：
using System.Data;
using System.Web.UI.WebControls;
///<summary>
/// Gridview綁定的數(shù)據(jù)記錄為空時顯示Gridview的表頭，并顯示沒有記錄的提示
///</summary>
public class GridviewControl
{
//當Gridview數(shù)據(jù)為空時顯示的信息
private static string EmptyText = "沒有記錄";
public GridviewControl()
{
}
///<summary>
///防止PostBack后Gridview不能顯示
///</summary>
///<param name="gridview"></param>
public static void ResetGridView(GridView gridview)
{
//如果數(shù)據(jù)為空則重新構造Gridview
if (gridview.Rows.Count == 1 && gridview.Rows[0].Cells[0].Text == EmptyText)
{
int columnCount = gridview.Columns.Count;
gridview.Rows[0].Cells.Clear();
gridview.Rows[0].Cells.Add(new TableCell());
gridview.Rows[0].Cells[0].ColumnSpan = columnCount;
gridview.Rows[0].Cells[0].Text = EmptyText;
gridview.Rows[0].Cells[0].Style.Add("text-align", "center");
}
}
///<summary>
///綁定數(shù)據(jù)到GridView，當表格數(shù)據(jù)為空時顯示表頭
///</summary>
///<param name="gridview"></param>
///<param name="table"></param>
public static void GridViewDataBind(GridView gridview, DataTable table)
{
//記錄為空重新構造Gridview
if (table.Rows.Count == 0)
{
table = table.Clone();
table.Rows.Add(table.NewRow());
gridview.DataSource = table;
gridview.DataBind();
int columnCount = table.Columns.Count;
gridview.Rows[0].Cells.Clear();
gridview.Rows[0].Cells.Add(new TableCell());
gridview.Rows[0].Cells[0].ColumnSpan = columnCount;
gridview.Rows[0].Cells[0].Text = EmptyText;
gridview.Rows[0].Cells[0].Style.Add("text-align", "center");
}
else
{
//數(shù)據(jù)不為空直接綁定
gridview.DataSource = table;
gridview.DataBind();
}
//重新綁定取消選擇
gridview.SelectedIndex = -1;
}
}
你可以把這個類編譯成 DLL，讓各個地方調用。
4．6使用示例
這個類的使用很簡單，就是在每次進行數(shù)據(jù)綁定是調用 GridViewDataBind，這個函數(shù)的第一個參數(shù)是要綁定數(shù)據(jù)的 GridView 第二個參數(shù)是包含數(shù)據(jù)字段列的 DataTable，可能為空可能不空，如果數(shù)據(jù)不空，函數(shù)則自動進行正常綁定，否則顯示“沒有記錄”的提示。
上面的按鈕事件的代碼可以改成如下所示：
DataTable dt = new DataTable();
dt.Columns.Add("temple_id");
dt.Columns.Add("temple_name");
dt.Columns.Add("location");
dt.Columns.Add("build_date");
GridviewControl.GridViewDataBind(this.GridViewEmptyDataTest, dt);
最后在 Page_Load 中對本頁面所有 GridView 調用 ResetGridView 函數(shù)，如下所示：
if (IsPostBack)
{
GridviewControl.ResetGridView(this.GridViewEmptyDataTest);
