How to display confirmation message with GridView ShowDeleteButton CommandField

Question

I'm trying to attach a Javascript function to confirm a delete of a record in a GridView. I know this can be done more easily using an asp:LinkButton in an ItemTemplate but I am trying to attach it to a CommandField - ShowDeleteButton button.

I've tried to follow this tutorial: display-confirmation-message-on-gridview-deleting

I am new to GridView and my implementation is in VB.Net not C#. Here is the code where I try to inject the Javascript function and I cannot figure out how/why my row.cell references are wrong:

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As GridViewRowEventArgs) _
    Handles GridView1.RowDataBound
    If e.Row.RowState <> DataControlRowState.Edit Then
        If e.Row.RowType = DataControlRowType.DataRow Then  'check for RowType DataRow
            Dim id As String = e.Row.Cells(0).Text      'get the position to be deleted
           Try
            'cast the ShowDeleteButton link to linkbutton
            Dim lb As LinkButton
            Dim i As Integer = 4            'cell we want in the row (relative to 0 not 1) 
            lb = DirectCast(e.Row.Cells(i).Controls(2), LinkButton)
            If lb IsNot Nothing Then        'attach the JavaScript function with the ID as the parameter
                lb.Attributes.Add("onclick", "return ConfirmOnDelete('" & id & "');")
            End If
           Catch ex As Exception
           End Try
        End If
    End If

Here is my GridView markup snippet (a bit more busy than all bound columns; I count 3 TemplateField items after the first and only BoundField to arrive at the 5th column hence i = 4 above):

<Columns>
    <asp:BoundField DataField="PositionID" HeaderText="ID" ReadOnly="true" />
    <asp:TemplateField HeaderText="PositionTitle">
        <ItemTemplate>
            <%# Eval("PositionTitle")%>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:TextBox runat="server" ID="txtPositionTitle" Text='<%# Eval("PositionTitle")%>' />
        </EditItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Incumbent">
        <ItemTemplate>
            <asp:Label ID="lblUser" runat="server" Text='<%# Eval("Incumbent")%>'></asp:Label>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:Label ID="lblUser" runat="server" Text='<%# Eval("Incumbent")%>' Visible = "false"></asp:Label>            
            <asp:DropDownList Width="100%" runat="server" 
               id="ddlUsers" AutoPostBack="true" 
               DataTextField="FullName" DataValueField="UserID"
               OnSelectedIndexChanged="ddlUsers_SelectedIndexChanged">
            </asp:DropDownList> 
        </EditItemTemplate> 
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Backup">
        <ItemTemplate>
            <%#Eval("Backup")%>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:Label ID="lblBackup" runat="server" Text='<%# Eval("Backup")%>' Visible = "false"></asp:Label>         
            <asp:DropDownList Width="100%" runat="server" 
               id="ddlUsersBackup" AutoPostBack="true" 
               DataTextField="FullName" DataValueField="UserID"
               OnSelectedIndexChanged="ddlUsersBackup_SelectedIndexChanged">
            </asp:DropDownList> 
        </EditItemTemplate>     
    </asp:TemplateField>

    <asp:CommandField ButtonType="Button" ControlStyle-CssClass="coolbutton" 
        ShowEditButton="true" 
        ShowDeleteButton="true"
        ShowCancelButton="true" /> 

When I ignore the error, the Command buttons are indeed in the 5th column:

The error I get without the Try/Catch is:

Answer 1

If you haven't figured out yet, your problem is in ButtonType="Button" here:

 <asp:CommandField ButtonType="Button" ControlStyle-CssClass="coolbutton" 
        ShowEditButton="true" 
        ShowDeleteButton="true"
        ShowCancelButton="true" /> 

You can't cast a command button to link button. You have to define it as Link button (please refer to MSDN for details of CommandField class). This is working:

<asp:CommandField ButtonType="Link" ControlStyle-CssClass="coolbutton" 
            ShowEditButton="true" 
            ShowDeleteButton="true"
            ShowCancelButton="true" />