阿杰,我来给你整理一个 最基础、清晰的 GridView 编辑操作示例,适合直接在 ASP.NET WebForms 使用。这个示例实现 行内编辑、更新和取消操作,数据源可以是数据库或内存 DataTable。
1️⃣ 前端 GridView (.aspx)
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
OnRowEditing="GridView1_RowEditing"
OnRowCancelingEdit="GridView1_RowCancelingEdit"
OnRowUpdating="GridView1_RowUpdating">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" />
<asp:BoundField DataField="Name" HeaderText="姓名" />
<asp:BoundField DataField="Age" HeaderText="年龄" />
<asp:CommandField ShowEditButton="True" />
</Columns>
</asp:GridView>
CommandField ShowEditButton="True"
:显示编辑按钮。AutoGenerateColumns="False"
:自定义显示列。
2️⃣ 后端示例 (.aspx.cs)
这里用 DataTable 模拟数据源,方便演示:
using System;
using System.Data;
public partial class GridViewEditDemo : System.Web.UI.Page
{
// 模拟数据库
private DataTable GetData()
{
if (Session["dt"] == null)
{
DataTable dt = new DataTable();
dt.Columns.Add("ID", typeof(int));
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("Age", typeof(int));
dt.Rows.Add(1, "Alice", 23);
dt.Rows.Add(2, "Bob", 30);
dt.Rows.Add(3, "Charlie", 28);
Session["dt"] = dt;
}
return (DataTable)Session["dt"];
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGrid();
}
}
private void BindGrid()
{
GridView1.DataSource = GetData();
GridView1.DataBind();
}
protected void GridView1_RowEditing(object sender, System.Web.UI.WebControls.GridViewEditEventArgs e)
{
GridView1.EditIndex = e.NewEditIndex; // 设置当前编辑行
BindGrid();
}
protected void GridView1_RowCancelingEdit(object sender, System.Web.UI.WebControls.GridViewCancelEditEventArgs e)
{
GridView1.EditIndex = -1; // 取消编辑
BindGrid();
}
protected void GridView1_RowUpdating(object sender, System.Web.UI.WebControls.GridViewUpdateEventArgs e)
{
DataTable dt = GetData();
int rowIndex = e.RowIndex;
// 获取编辑后的值
string newName = ((System.Web.UI.WebControls.TextBox)GridView1.Rows[rowIndex].Cells[1].Controls[0]).Text;
int newAge = int.Parse(((System.Web.UI.WebControls.TextBox)GridView1.Rows[rowIndex].Cells[2].Controls[0]).Text);
// 更新 DataTable
dt.Rows[rowIndex]["Name"] = newName;
dt.Rows[rowIndex]["Age"] = newAge;
GridView1.EditIndex = -1; // 退出编辑状态
BindGrid();
}
}
3️⃣ 关键点说明
- 行内编辑
- 点击编辑按钮后,该行变为可输入的 TextBox 控件。
- 取消编辑
- 点击取消按钮恢复显示原值。
- 更新数据
RowUpdating
事件中获取 TextBox 值,更新数据源即可。
- 数据源
- 生产环境通常使用数据库,如 SQL Server,可在
RowUpdating
中执行UPDATE
语句。
- 生产环境通常使用数据库,如 SQL Server,可在
这个示例适合入门,理解 GridView 编辑流程:
点击编辑 → 修改值 → 更新 → 数据刷新显示。
发表回复