GridView数据库分页+自定义分页导航(三):编辑和删除

2021-01-29 10:58:48 浏览数 (1)

完成后的图:

首先我们之前的完成的模板是这样子的:

还没有绑定任何功能,只是设置了CommandName,这里在做简单做一下那个步骤。右击GridView右上角的小三角,进入编辑模板,选中这两个按钮,然后设置CommandName的值为Edit和Delete,这个值是默认的,

再选中【删除】按钮,做下面操作。

自定义绑定表达式:<%# Eval("id")%>,我用的是2015版本,只需要输入Eval("id")就行了。这样绑定id后,在后面的方法可以获取到这个id。

然后选择【EditItemTemplate】

在里面在再放两个Button,并设置保存按钮的CommandName为Save,取消的为Cancel,然后结束编辑模板。

选中GridView,在

选择GridView,在右下角属性栏中,双击这四个属性,让它自动生成方法,

编辑方法:

代码语言:javascript复制
  protected void codeTable_RowEditing(object sender, GridViewEditEventArgs e)
        {
            codeTable.EditIndex = e.NewEditIndex;
            viewData();
        }

这时,测试,

你会发现,编辑那一行都是可编辑的,怎么办?而且它生成的输入框很长,都把你的表格样式给破坏了。

解决办法就是设置它的表格头,把表头的宽度固定就可以了。

设置的方式有两种,

第一种:

选中GridView,在右上角的小三角,【编辑列】

进入到这个界面,找到【HeaderStyle】在里面找到【width】设置它的宽度为10%,其他列同样方法设置。

第二种:

代码语言:javascript复制
  <HeaderStyle Width="10%" />

将这句放在表头下面,如:

这,它是在<asp:BoundField></asp:BoundField>里的。

然后是指定列的编辑,基本上我们只想编辑其中的一两列,所以。

只要在不想编辑的列的表头加上ReadOnly=“true”就可以了

代码语言:javascript复制
  <asp:BoundField DataField="pname"   HeaderText="省"  ReadOnly="True">

OK , 然后是取消编辑和保存,底层方法你们自己实现,这里是我已经完成的代码。

代码语言:javascript复制
  protected void codeTable_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
        {
            codeTable.EditIndex = -1;
            viewData();
        }

        protected void codeTable_RowUpdating(object sender, GridViewUpdateEventArgs e)
        {
            int rId = e.RowIndex;
            //验证输入内容
            string ps = ((TextBox)(codeTable.Rows[rId].Cells[3].Controls[0])).Text;
            string area = ((TextBox)(codeTable.Rows[rId].Cells[4].Controls[0])).Text;
            string sid = codeTable.DataKeys[e.RowIndex].Value.ToString();//获取绑定的id
            if (!(MyUtil.MatcherDouble(ps) || MyUtil.MatcherDouble(area)))
            {
                Response.Write("<script>confirm('请输入正确的数字');</script>");
                return;
            }
            county c = new county();
            countyB.save(double.Parse(ps),double.Parse(area),int.Parse(sid));
            codeTable.EditIndex = -1;//保存后退出编辑
            viewData();
        }

删除:这里DATAKeys[]获取的就是我们之前绑定的id,

代码语言:javascript复制
 protected void codeTable_RowDeleting(object sender, GridViewDeleteEventArgs e)
        {
            int id = Convert.ToInt32(codeTable.DataKeys[e.RowIndex].Value);//获取绑定的id
            countyB.delte(id);
            viewData();
        }

删除要加一个提醒,告诉用户是否删除,在RowDataBound方法里做这件事,这个方法是每绑定一行,触发一次这个事件。

相应的在GridView属性中双击生成方法

代码语言:javascript复制
 protected void codeTable_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                if (e.Row.RowState == DataControlRowState.Normal || e.Row.RowState == DataControlRowState.Alternate)
                {
                    ((Button)e.Row.Cells[8].Controls[3]).Attributes.Add("onclick", "javascript:return confirmDelete()");
                }
            }
        }

这里编辑、删除、保存、和取消完成。

asp

0 人点赞