WebForm GridView设置分页，编辑，更新，取消，删除，按钮，以及排序。

最新推荐文章于 2023-12-12 15:41:13 发布

转载最新推荐文章于 2023-12-12 15:41:13 发布 · 1k 阅读

C#基础类同时被 2 个专栏收录

232 篇文章

订阅专栏

WEBFORM技术类

18 篇文章

订阅专栏

本文详细介绍如何在ASP.NET中使用GridView控件实现数据展示、编辑、删除等功能，并通过实例代码讲解具体配置步骤。

数据库：

首先要在GridView上取消掉自动生成列（根据T-SQL）

[html] view plain copy

print ?

AutoGenerateColumns="False"

AutoGenerateColumns="False"

添加BoundField，就是绑定列，设置DataField（绑定的列），HeaderText列标题。

实际就是下面的代码：

还需要开启：编辑，更新，取消，删除（CommandField），以及设置事件：

实际就是下面的代码:

[html] view plain copy

print ?

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowCancelingEdit="GridView1_RowCancelingEdit" OnRowEditing="GridView1_RowEditing" AllowSorting="True" OnRowDeleting="GridView1_RowDeleting" OnRowUpdating="GridView1_RowUpdating" OnSorting="GridView1_Sorting" >
<Columns>
<asp:BoundField DataField="新闻标题" HeaderText="新闻标题" SortExpression="新闻标题" />
<asp:BoundField DataField="新闻内容" HeaderText="新闻内容" SortExpression="新闻内容" />
<asp:CommandField ShowEditButton="True" />
<asp:CommandField ShowDeleteButton="True" />
</Columns>
</asp:GridView>

<asp:GridView ID="GridView1" runat="server" AllowPaging="True"  AutoGenerateColumns="False" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowCancelingEdit="GridView1_RowCancelingEdit" OnRowEditing="GridView1_RowEditing" AllowSorting="True" OnRowDeleting="GridView1_RowDeleting" OnRowUpdating="GridView1_RowUpdating" OnSorting="GridView1_Sorting" >
            <Columns>
                <asp:BoundField DataField="新闻标题" HeaderText="新闻标题" SortExpression="新闻标题" />
                <asp:BoundField DataField="新闻内容" HeaderText="新闻内容" SortExpression="新闻内容" />
                <asp:CommandField ShowEditButton="True" />
                <asp:CommandField ShowDeleteButton="True" />
            </Columns>
        </asp:GridView>

直接上全部代码吧，时间关系：

WebForm1.aspx

[html] view plain copy

print ?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="UI.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowCancelingEdit="GridView1_RowCancelingEdit" OnRowEditing="GridView1_RowEditing" AllowSorting="True" OnRowDeleting="GridView1_RowDeleting" OnRowUpdating="GridView1_RowUpdating" OnSorting="GridView1_Sorting" >
<Columns>
<asp:BoundField DataField="新闻标题" HeaderText="新闻标题" SortExpression="新闻标题" />
<asp:BoundField DataField="新闻内容" HeaderText="新闻内容" SortExpression="新闻内容" />
<asp:CommandField ShowEditButton="True" />
<asp:CommandField ShowDeleteButton="True" />
</Columns>
</asp:GridView>
</form>
</body>
</html>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="UI.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            
        </div>
        <asp:GridView ID="GridView1" runat="server" AllowPaging="True"  AutoGenerateColumns="False" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowCancelingEdit="GridView1_RowCancelingEdit" OnRowEditing="GridView1_RowEditing" AllowSorting="True" OnRowDeleting="GridView1_RowDeleting" OnRowUpdating="GridView1_RowUpdating" OnSorting="GridView1_Sorting" >
            <Columns>
                <asp:BoundField DataField="新闻标题" HeaderText="新闻标题" SortExpression="新闻标题" />
                <asp:BoundField DataField="新闻内容" HeaderText="新闻内容" SortExpression="新闻内容" />
                <asp:CommandField ShowEditButton="True" />
                <asp:CommandField ShowDeleteButton="True" />
            </Columns>
        </asp:GridView>
    </form>
</body>
</html>

WebForm1.aspx.cs

[csharp] view plain copy

print ?

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using BLL;
using Model;
using System.Data;
namespace UI
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//这里给一个初始值 (ViewState是一个字典（服务器控件的一个跨页变量）)
ViewState["SortOrder"] = "新闻标题";//排序表达式SortExpression实际就是DataField 就是T-SQL语句查询出来的列名
//排序表达式实际就是设置按照哪个列进行排序而已
ViewState["SortDire"] = "ASC";//排序顺序（升序）
Bind();
}
}
//把绑定数据写到一个方法里
private void Bind()
{
UserBLL ub = new UserBLL();
//（重点）设置一个标识（一般是主键）绑定在每一项上去，用于删除数据时，获取主键。（把主键id放在DataKeys）
this.GridView1.DataKeyNames = new string[] { "id" }; //这个是绑定在行上的
//排序
DataView view = ub.ShowAll().DefaultView;//从datatable取出dataview用于排序
//排序字符串排序表达式（空格）升序/逆序
string sort = ViewState["SortOrder"].ToString() + " " + ViewState["SortDire"].ToString();
//设置排序字符串
view.Sort = sort;
//绑定数据源
this.GridView1.DataSource = view;
this.GridView1.DataBind();
}
//下一页（用户点击页数按钮时）
protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
//当前页数等于用户点击的那一页
this.GridView1.PageIndex = e.NewPageIndex;
//重新绑定
Bind();
}
//编辑时
protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
{
//设置编辑时的行等于用户触发事件的这个行
this.GridView1.EditIndex = e.NewEditIndex;
//重新绑定
Bind();
}
//点击取消时（取消编辑）
protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
{
//设置当前选中行索引为-1（也就是没有）
this.GridView1.EditIndex = -1;
//重新绑定
Bind();
}
//编辑时的更新按钮
protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
//当前更新的行数
int index = e.RowIndex;
//(重点)获取格子里面，第index行，第0号单元格里面第0个控件（也就是TextBox）强转，获取值
string newsTitle= ((TextBox)this.GridView1.Rows[index].Cells[0].Controls[0]).Text.ToString();
string newsContent = ((TextBox)this.GridView1.Rows[index].Cells[1].Controls[0]).Text.ToString();
//这里的id是绑定上去的主键
int id = Convert.ToInt32(this.GridView1.DataKeys[index].Value) ;
UserBLL ub = new UserBLL();
News ne = new News();
ne.Id = id;
ne.Title = newsTitle;
ne.Content = newsContent;
if (ub.UpdateNews(ne) == 1)
{
//更新成功
this.GridView1.EditIndex = -1;//设置编辑为否
this.Bind();//重新绑定
}
else {
//更新失败
this.GridView1.EditIndex = -1;//设置编辑为否
this.Bind();//重新绑定
}
}
//点击删除时
protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
//获取产生事件的行
int index = e.RowIndex;
//获取主键
int key=(int) this.GridView1.DataKeys[index].Value;
UserBLL ub = new UserBLL();
if (ub.delNews(key) == 1)
{
//删除成功
this.GridView1.EditIndex = -1;//设置编辑为否
this.Bind();//重新绑定
}
else {
//删除失败
this.GridView1.EditIndex = -1;//设置编辑为否
this.Bind();//重新绑定
}
}
//双击表列标题排序时
protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)
{
//产生点击事件的排序字符串
string expression = e.SortExpression;
if (ViewState["SortOrder"].ToString() == expression) //如果上次点击的是这个，就直接设置ASC,DESC
{
if (ViewState["SortDire"].ToString() == "ASC")
{
ViewState["SortDire"] = "DESC";
}
else
{
ViewState["SortDire"] = "ASC";
}
}
else {
//如果上次没有点击这个就直接排序
ViewState["SortOrder"] = expression;
}
/////////////这里只是设置一些全局变量实际排序操作在 DataView的Sort排序字符串里面设置
Bind();//重新绑定
}
}
}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using BLL;
using Model;
using System.Data;
namespace UI
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                //这里给一个初始值  (ViewState是一个字典（服务器控件的一个跨页变量）)
                ViewState["SortOrder"] = "新闻标题";//排序表达式SortExpression实际就是DataField 就是T-SQL语句查询出来的列名
                //排序表达式 实际就是设置按照哪个列进行排序而已
                ViewState["SortDire"] = "ASC";//排序顺序（升序）
                Bind();
            }
        }
        //把绑定数据 写到一个方法里
        private void Bind()
        {
            UserBLL ub = new UserBLL();
           
            //（重点）设置一个标识（一般是主键）绑定在每一项上去，用于删除数据时，获取主键。（把主键id放在DataKeys）
            this.GridView1.DataKeyNames = new string[] { "id" };  //这个是绑定在行上的
            //排序
            DataView view = ub.ShowAll().DefaultView;//从datatable取出dataview用于排序
            //排序字符串   排序表达式（空格） 升序/逆序
            string sort = ViewState["SortOrder"].ToString() + " " + ViewState["SortDire"].ToString();
            //设置排序字符串
            view.Sort = sort;
            //绑定数据源
            this.GridView1.DataSource = view;
            this.GridView1.DataBind();
        }
        //下一页（用户点击页数按钮时）
        protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
        {
            //当前页数等于 用户点击的那一页
            this.GridView1.PageIndex = e.NewPageIndex;
            //重新绑定 
            Bind();
        }
        //编辑时
        protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
        {
            //设置编辑时的行 等于用户触发事件的这个行
            this.GridView1.EditIndex = e.NewEditIndex;
            //重新绑定 
            Bind();
        }
        //点击取消时（取消编辑）
        protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
        {
            //设置当前选中行索引为-1（也就是没有）
            this.GridView1.EditIndex = -1;
          
            //重新绑定 
            Bind();
        }
        //编辑时的更新按钮
        protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
        {
            //当前更新的行数
            int index = e.RowIndex;
            //(重点)获取格子里面，第index行，第0号单元格里面第0个控件（也就是TextBox）强转，获取值
            string newsTitle= ((TextBox)this.GridView1.Rows[index].Cells[0].Controls[0]).Text.ToString();
            string newsContent = ((TextBox)this.GridView1.Rows[index].Cells[1].Controls[0]).Text.ToString();
            //这里的id是绑定上去的主键
           int id = Convert.ToInt32(this.GridView1.DataKeys[index].Value) ;
            UserBLL ub = new UserBLL();
            News ne = new News();
            ne.Id = id;
            ne.Title = newsTitle;
            ne.Content = newsContent;
            if (ub.UpdateNews(ne) == 1)
            {
                //更新成功
                this.GridView1.EditIndex = -1;//设置编辑为否
                this.Bind();//重新绑定
            }
            else {
                //更新失败
                this.GridView1.EditIndex = -1;//设置编辑为否
                this.Bind();//重新绑定
            }
        }
        //点击删除时
        protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
        {
            //获取产生事件的行
            int index = e.RowIndex;
            //获取主键
           int key=(int) this.GridView1.DataKeys[index].Value;
            UserBLL ub = new UserBLL();
            if (ub.delNews(key) == 1)
            {
                //删除成功
                this.GridView1.EditIndex = -1;//设置编辑为否
                this.Bind();//重新绑定
            }
            else {
                //删除失败
                this.GridView1.EditIndex = -1;//设置编辑为否
                this.Bind();//重新绑定
            }
        }
        //双击表列标题 排序时
        protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)
        {
            //产生点击事件的排序字符串
            string expression = e.SortExpression;
            if (ViewState["SortOrder"].ToString() == expression)  //如果上次点击的是这个，就直接设置ASC,DESC
            {
                if (ViewState["SortDire"].ToString() == "ASC")
                {
                    ViewState["SortDire"] = "DESC";
                }
                else
                {
                    ViewState["SortDire"] = "ASC";
                }
            }
            else {
                //如果上次没有点击这个 就直接排序
                ViewState["SortOrder"] = expression;
            }
            /////////////这里只是设置一些全局变量 实际排序操作  在 DataView的Sort排序字符串里面设置
            Bind();//重新绑定
        }
    }
}

效果：