• 如何让Gridview在没有数据的时候显示表头(转)


    1.前言

    当对GridView控件进行数据绑定时,如果绑定的记录为空,网页上就不显示GridView,造成页面部分空白,页面布局结构也受影响。下面讨论的方法可以让GridView在没有数据记录的时候显示表的字段结构和显示提示信息。
    GridView要绑定的字段和temple的字段一样,在这里我们利用GridView原有的功能,设定当数据为空是显示“Data Is Empty”,如果没有设定EmptyDataText属性,当绑定的记录为空时,GridView将不在页面显示。

    4.数据显示

    41普通空记录显示

    编写ButtonNormalBind的事件函数ButtonNormalBind_Click,添加如下代码,来测试没有经过处理的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();
    }
    执行这些代码后,GridView显示结果如下图所示:
     
    可以看到这样简单的提示看不出GridView的结构来,在大多数的实际应用中我们希望看到GridView到底有哪些字段。

    42增加空行来显示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();
    在每次绑定前判断,如果为空就增加一空行,这样绑定的结果如下图所示:
    可以看得表头已经可以显示了,但是显示的空行没有任何数据也让人费解,可不可以增加一下提示信息呢?

    43增加空记录提示

    我们在数据绑定后增加一些代码对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");
    改良后的显示结果如下图所示:
    看来显示结果已经达到了我们的要求,但是当页面上有其他按钮操作导致页面PostBack时,页面再次显示确没有了提示信息变成如下图所示的样子:
    这并不是我们想要的。

    44防止PostBack时页面显示变化

    为了防止显示改变我们在Page_Load事件里添加如下代码,从而重新绑定GridView:
    if (IsPostBack)
            {
                //如果数据为空则重新构造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数据绑定时都可以轻易地实现我们的要求。

    45封装

    类的封装代码如下所示:
    using System.Data;
    using System.Web.UI.WebControls;
     
    /// <summary>
    /// Gridview绑定的数据记录为空时显示Gridview的表头,并显示没有记录的提示
    /// </summary>
    public class GridviewControl
    {
        //当Gridview数据为空时显示的信息
        private static string EmptyText = "没有记录";
     
         public GridviewControl()
         {
            
         }
     
        /// <summary>
        /// 防止PostBack后Gridview不能显示
        /// </summary>
        /// <param name="gridview"></param>
        public static void ResetGridView(GridView gridview)
        {
            //如果数据为空则重新构造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>
        /// 绑定数据到GridView,当表格数据为空时显示表头
        /// </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
            {
                //数据不为空直接绑定
                gridview.DataSource = table;
                gridview.DataBind();
            }
     
            //重新绑定取消选择
            gridview.SelectedIndex = -1;
        }
    }
    你可以把这个类编译成DLL,让各个地方调用。

    46使用示例

    这个类的使用很简单,就是在每次进行数据绑定是调用GridViewDataBind,这个函数的第一个参数是要绑定数据的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");
    GridviewControl.GridViewDataBind(this.GridViewEmptyDataTest, dt);
    最后在Page_Load中对本页面所有GridView调用ResetGridView函数,如下所示:
    if (IsPostBack)
            {
                GridviewControl.ResetGridView(this.GridViewEmptyDataTest);
        }
     
    在此提供一个网站测试源码,可以按照2中所说的数据表建立test数据库,并在表中加入相应数据进行测试,记得把连接串改一下哦。
     测试源码:http://dl2.csdn.net/down4/20071008/08205401208.rar
    5.总结
       MS的asp.net为我们提供了方便好用的控件,如果适当地对这些控件的使用方法作些小改动就能做出更加完美的效果来。
     

    文章来源:http://blog.sina.com.cn/s/blog_4a5e327701000b7x.html
  • 相关阅读:
    no route to host
    修改文件失败,提示E509: 无法创建备份文件 (请加 ! 强制执行)
    OAuth2.0的四种授权模式
    Django--JWT认证
    Django--数据库ORM操作
    DRF中限流、过滤、排序、分页
    Django框架中序列化与反序列化与字段验证
    21.Django三种风格的模型继承
    20.第三方微博登录Django+Vue
    博客园图片点击放大功能
  • 原文地址:https://www.cnblogs.com/pyt5208/p/964365.html
Copyright © 2020-2023  润新知