在一个CommandField中为删除按钮设置OnClientClick属性[Scott Mitchell的ASP.NET2.0数据指南tutorial-22]
在一个CommandField中为删除按钮设置OnClientClick属性
在模板中直接使用Button,LinkButton,或者ImageButton的时候,可以直接为它的OnClientClick属性设置确认窗口并返回confirm(string) JavaScript的返回值。然而,CommandField是在GridView或者DetailsView上内置的一些删除按钮,而且它们本身不具有OnClientClick属性可以设置声明。相反,我们必须要在处理GridView或者DetailsView,它们适当的DataBound事件的代码中,引用这个删除按钮,然后在那里设置它的OnClientClick属性。
注意:
当我们在适当的DataBound事件处理器中设置删除按钮的OnClientClick属性时候,我们已经有权限访问当前绑定的数据。这意味着我们可以扩展确认信息,并包含具体记录的详细信息,比如,“你确定要删除这个Chai产品吗?“这些定制也可以在模板的数据绑定的语法中实现。
为了实践在一个CommandField中设置删除按钮的OnClientClick属性,我们在页面上添加一个GridView。配置这个GridView使用FormView一样的ObjectDataSource控件。同时,限制GridView的BoundFields属性只包括产品名称,分类和供应商。最后,在GridView的属性窗口中勾上Enable Deleting的多选框。这样会在GridView的ColumnCollection的集合中添加一列CommandField,并且它的ShowDeleteButton属性会设置成true。
做了这些改变后,你的GridView的声明标记应该如下所示:
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
2
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
3
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
4
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
5
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
6
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
7
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
8
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
9
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
10
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
11
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
12
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
13
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
14
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
15
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
16
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
17
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
18
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
这个CommandField包含一个删除LinkButton实例,并且可以在GridView的RowDataBound事件处理器中被访问。一旦被引用,我们就可以相应地设置它的OnClientClick属性。通过下面的代码来新建一个RowDataBound事件的处理器:
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
这个事件处理器将在代码中绑定数据和引用删除按钮的时候被调用。总的来说,使用了以下模式:
![](https://chagel.cnblogs.com/Images/OutliningIndicators/None.gif)
ButtonType是被CommandField使用的一种按钮类型,可以是Button,LinkButton,或者ImageButton。默认情况下,CommandField使用LinkButton,但也可以通过CommandField的ButtonType属性来定制。CommandFieldIndex是CommandField在GridView中Columns集合中的原始索引,而controlIndex是删除按钮在CommandField的Controls集合中的索引。controlIndex的值由按钮在CommandField中和其他按钮的相对位置决定。例如,如果在CommandField中只有一个删除按钮,那么它的索引就是0。然而,如果在删除按钮前面还有一个编辑按钮,那么索引值是2。因为在删除按钮前面有两个控件,一个是编辑按钮,另一个是LiteralControl,用来隔离编辑按钮和删除按钮。
在我们的例子中,CommandField使用了LinkButton,在最左端,commandFieldIndex的值是0。因为除了删除按钮,没有其他控件,所以controlIndex的值也为0。
在引用了CommandField中的删除按钮之后,我们接下来可以获得GridView当前数据列的一些产品信息。最后,我们为删除按钮设置了OnClientClick属性的JavaScript值,其中包含了产品的名称。因为我们用单引号标记了传入confirm(string)的字符串参数,对于产品的名称我们必须要过滤可能出现在其中的单引号。具体来说,我们可以把产品名称中含有的单引号转义成,“\’“。
做完这些改变之后,点击GridView中的删除按钮,可以显示一个定制后的确认信息(见图4)。如果用户点击弹出的确认窗口中的取消,回传将会被取消,从而阻止了删除操作发生。
注意:
我们同样可以在代码中对DetailsView的CommandField使用这种技术。然而对于DetailsView,你需要为DataBound事件提供一个处理器,因为它没有RowDataBound事件。