GridView动态添加一编辑行

以你之姓@ 2022-08-26 05:58 462阅读 0赞

这几天遇到了怎样给GridView动态增加一编辑行的需求，因为之前一直没有碰到过，所以一时也不知道怎么实现。后来通过百度看了一些大神给的解决方案和例子，自己也转载了一篇实现这个功能的博客。方法总的来说，很多也很灵活，有的说用DataTable先取GridView里面的数据，再增加一行，然后再绑定到GridView。有的说用js+table也可以解决。

通过我一下午的努力，照着别人的博客也写了个Demo，严格来说，这种不是点击增加一行，而是给人的错觉是增加一行而已。也就是在GridView下面再加一个同样长的Table，然后对应的列中加入TextBox,再在Table下面增加一个按钮，点击按钮把Table里面的内容存到数据库，然后取出来绑定到GridView中。

下面是我的流程和代码：

1.前台，先加一个GridView控件，再在下面加一个Table,再加一个button

<%--GridView开始--%>
                <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" EmptyDataText="没有记录">
                    <Columns>
                        <asp:BoundField HeaderText="品牌" DataField="品牌" ItemStyle-Width="100" />
                        <asp:BoundField HeaderText="价格" DataField="价格" ItemStyle-Width="100" />
                        <asp:BoundField HeaderText="数量" DataField="数量" ItemStyle-Width="100" />
                        <asp:BoundField HeaderText="生产日期" DataField="生产日期" DataFormatString="{0:M-dd-yyyy}" ItemStyle-Width="100" />
                        <asp:BoundField HeaderText="商品详情" DataField="商品详情" ItemStyle-Width="100" />
                        <asp:BoundField HeaderText="生产地" DataField="生产地" ItemStyle-Width="100" />
                    </Columns>
                </asp:GridView>
                <%--GridView结束--%>
                <%--Table开始--%>
                <table border="1" style="border-collapse:collapse;">
                    <tr>
                        <td>
                            <asp:TextBox ID="TextBox1" runat="server" Width="93"></asp:TextBox>
                        </td>
                        <td>
                            <asp:TextBox ID="TextBox2" runat="server" Width="93"></asp:TextBox>
                        </td>
                        <td>
                            <asp:TextBox ID="TextBox3" runat="server" Width="93"></asp:TextBox>
                        </td>
                        <td>
                            <asp:TextBox ID="TextBox4" runat="server" Width="93"></asp:TextBox>
                        </td>
                        <td>
                            <asp:TextBox ID="TextBox5" runat="server" Width="93"></asp:TextBox>
                        </td>
                        <td>
                            <asp:TextBox ID="TextBox6" runat="server" Width="93"></asp:TextBox>
                        </td>
                    </tr>
                </table>
                <%--Table结束--%>
                <%--Button开始--%>
                <asp:Button ID="Button1" runat="server" Text="添加" OnClick="Button1_Click" />
                <%--Button结束--%>

2.后台代码：

protected void Page_Load(object sender, EventArgs e) { if(!IsPostBack) { string con = ConfigurationManager.ConnectionStrings["con"].ToString(); SqlConnection sqlcon = new SqlConnection(con); string sql = "select 品牌,价格,数量,商品详情,生产日期,生产地 from Shuma"; sqlcon.Open(); SqlDataAdapter sqlda = new SqlDataAdapter(sql, sqlcon); DataSet ds = new DataSet(); sqlda.Fill(ds); sqlcon.Close(); if(ds.Tables[0].Rows.Count == 0) { DataTable dt = new DataTable(); dt.Columns.Add("品牌"); dt.Columns.Add("价格"); dt.Columns.Add("数量"); dt.Columns.Add("商品详情"); dt.Columns.Add("生产日期"); dt.Columns.Add("生产地"); if(dt.Rows.Count == 0)
                       { dt.Rows.Add(dt.NewRow()); } GridView1.DataSource = dt; GridView1.DataBind(); GridView1.Rows[0].Cells[0].Text = "暂无记录"; GridView1.Rows[0].Cells[1].Text = "暂无记录"; GridView1.Rows[0].Cells[2].Text = "暂无记录"; GridView1.Rows[0].Cells[3].Text = "暂无记录"; GridView1.Rows[0].Cells[4].Text = "暂无记录"; GridView1.Rows[0].Cells[5].Text = "暂无记录"; } else { GridView1.DataSource = ds; GridView1.DataBind(); } }
           } protected void Button1_Click(object sender, EventArgs e) { string brand = TextBox1.Text.ToString(); int price =Convert.ToInt32(TextBox2.Text); int number = Convert.ToInt32(TextBox3.Text); DateTime productdate = Convert.ToDateTime(TextBox4.Text); string text = TextBox5.Text.ToString(); string place = TextBox6.Text.ToString(); string con = ConfigurationManager.ConnectionStrings["con"].ToString(); SqlConnection sqlcon = new SqlConnection(con); string sql = "insert into Shuma(品牌,价格,数量,商品详情,生产日期,生产地) values('"+brand+"','"+price+"','"+number+"','"+text+"','"+productdate+"','"+place+"')"; string sqlstr = "select 品牌,价格,数量,商品详情,生产日期,生产地 from Shuma"; sqlcon.Open(); SqlCommand sqlcom = new SqlCommand(sql,sqlcon); sqlcom.ExecuteNonQuery(); SqlDataAdapter sqlda = new SqlDataAdapter(sqlstr,sqlcon); DataSet ds = new DataSet(); sqlda.Fill(ds); GridView1.DataSource = ds; GridView1.DataBind(); sqlcon.Close(); } }

3.解释：

针对Page\_Load()函数

先从数据库里取数据放到ds(DataSet对象)中。if(ds.Tables\[0\].Rows.Count==0)用来判断ds中有没有数据。

如果没有，自己新建一个dt(DataTable对象),再在dt中做文章，给它加入列名(这个就对应的GridView的列名)，作用是让GridView在没有数据的情况下依旧显示出表头，dt.Rows.Add(dt.NewRow())这句话是用来给它加一个空行。GridView1.Rows\[0\].Cells\[0\].Text = "暂无记录"这句话是给新加的空行赋值(告诉用户没有记录)。

如果有，GridView绑定ds，然后显示出来。

针对Button1\_Click函数

分两步：

第一步，将TextBox里面的数据存到数据库中。

第二步，将数据库里面的数据取出来绑定到GridView然后显示出来。

综上所述，这种方法并不是真的增加一行，只是让用户觉得增加一行而已或者让用户始终感觉有可以输入的行。