GridView控件自带有选择、编辑与删除操作,当设置好后,点击表格中某一数据行的相关操作就可以对选中的该数据行进行设置。接下来简要介绍下这三种操作如何应用:
1.选择
图1 | 图2 |
首先如图1,在GridView控件的编辑列选项中添加CommandField字段,在该字段中把ShowSelectButton设为True。“选择”的外观、样式或者文本内容也都可以进行设置。设置好后就可以在GridView上看到每一数据行都增加了一列“选择”操作,如图2。然后在前台的GridView上添加 OnSelectedIndexChanged事件,后台也需要添加该事件对应的方法。可以手动添加,也可以通过双击图2上的“选择”字样自动添加。
也就是,前台的GridView上添加:OnSelectedIndexChanged="GridView1_SelectedIndexChanged"
。(函数名称可以自己定义。且本篇中前台GridView的ID都为GridView1)。然后,后台添加对应的方法事件如下:
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{
int index = GridView1.SelectedIndex; //选中的数据行索引
...//执行选中的操作
}
为了对选中的数据行执行相关操作,需要先判断点击的是哪一数据行的“选择”,因此需要在后台的函数方法中用GridView1.SelectedIndex来判断。
2.编辑
图3
如图3,在GridView控件的编辑列选项中添加CommandField字段,在该字段中把ShowEditButton设为True,同时可以设置其外观、样式等。我这里设置的ButtonType为Button,即按钮形式。但这时只是出现了编辑的按钮,点击它还不能进行编辑,所以需要添加编辑的事件。
在GridView上需要添加三个事件,分别是:编辑事件OnRowEditing、更新事件OnRowUpdating和取消编辑事件OnRowCancelingEdit。编辑事件是点击编辑按钮时触发的,编辑按钮点击后会变成一个更新按钮和取消按钮,更新按钮点击后更新编辑好的内容,取消按钮即取消编辑,点击后会恢复成更新前的内容。
注意,还要设置GridView属性DataKeyNames的值来绑定数据源中的某个键字段,以此来判断要编辑哪一数据行。
OnRowEditing="GridView1_RowEditing" OnRowCancelingEdit="GridView1_RowCancelingEdit" OnRowUpdating="GridView1_RowUpdating" DataKeyNames="绑定数据源中的键字段"
在前台Gridview设置好上述属性后,在后台要编写对应的处理事件:
//编辑某行数据
protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
{
this.GridView1.EditIndex = e.NewEditIndex;
...//执行相关操作
}
//更新编辑的数据行
protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
GridViewRow row = this.GridView1.Rows[e.RowIndex]; //获取要编辑的数据行
string id = e.Keys[0].ToString().Trim(); //获取编号
string m = ((TextBox)row.Cells[1].Controls[0]).Text.ToString(); //获取要编辑的数据行第2列单元格文本框编辑后的内容
...//执行更新操作
}
//取消编辑
protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
{
this.GridView1.EditIndex = -1; //取消编辑状态
...//执行相关操作
}
上述代码中 string id = e.Keys[0].ToString().Trim(); 是因为我在GridView的属性中设置了DataKeyNames="Tid"绑定了一个数据源中的主键Tid编号字段,然后就可以通过e.Keys[0]获取,即判断要编辑的是哪一数据行。(TextBox)是为了让要编辑的数据行的单元格出现文本框供编辑内容,所以 ((TextBox)row.Cells[n].Controls[0]).Text.ToString()就是获取要编辑的数据行的Cells[n],即第n+1列单元格文本框内编辑后的内容。
图4 编辑前的状态 | 图5 编辑状态 |
3.删除
添加删除操作首先也需要在前台GridView进行相关设置。在GridView的<Columns></Columns>
标签内添加删除按钮,代码如下:
<asp:TemplateField HeaderText="操作">
<ItemTemplate>
<asp:Button ID="DeleteButton" runat="server" CommandName="Delete" CausesValidation="False"
Text="删除" OnClientClick="javascript:return confirm('确认删除吗?');">
</asp:Button>
</ItemTemplate>
</asp:TemplateField>
同样地,在GridView上添加删除事件:OnRowDeleting="GridView1_RowDeleting"
,为了判断删除的是哪一数据行,还要有DataKeyNames="绑定的键字段"
,然后在后台的函数里进行删除处理:
//删除某行数据
protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
string id = e.Keys[0].ToString(); //删除的数据行id
...//执行删除处理
}
要判断删除的是哪一数据行,在前台设置GridView属性DataKeyNames的值来绑定数据源中的某个键字段,相当于给表中每个数据行设置了id,因此e.Keys[0].ToString()就是获取每个数据行独一无二的id来判断删除的是哪一行。