Adding a JavaScript confirmation prompt to a delete command button in an ASP.NET grid view?

Question

Hello all,

So I have an ASP.NET grid view:

<asp:GridView ID="gvReferences" runat="server" AutoGenerateColumns="False" ShowHeader="False"
    OnRowEditing="gvReferences_RowEditing" 
    OnRowDeleting="gvReferences_RowDeleting" onrowcreated="gvReferences_RowCreated">
    <Columns>
        <asp:TemplateField ItemStyle-Width="400px">
            <ItemTemplate>
                <asp:Label ID="lblId" Visible="false" runat="server" Text='<%# Eval("Id") %>' />
                <asp:Label ID="lblAssociatedSpecies" runat="server" Text='<%# Eval("Text") %>' />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:Label ID="lblKind" runat="server" Text='<%# Eval("Kind") %>' />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:CommandField ButtonType="Button" DeleteText="delete" ShowDeleteButton="True"
            ShowCancelButton="False" EditText="edit" ShowEditButton="True">
            <ControlStyle Width="60px" />
        </asp:CommandField>
    </Columns>
</asp:GridView>

I'd like to attach some JavaScript to the Delete command button to ask for confirmation before a row is deleted.

Any ideas?

Answer 1

You could always use a TemplateField rather than the CommandField.

<asp:TemplateField>
  <ItemTemplate>
    <asp:Button name="btnDelete" commandName="Delete" OnClientClick="return confirm('Delete 
this Item');" Text="Delete" runat="server" />
    <asp:Button name="btnEdit" commandName="Edit" Text="Edit" runat="server" />
  </ItemTemplate>
</asp:TemplateField>

Answer 2

When I've done this I've used a Template Field with the ConfirmButtonExtender from the Ajax Control Toolkit.

<asp:TemplateField>
   <ItemTemplate>   
       <asp:Button name="DeleteButton" commandName="Delete" Text="Delete" runat="server" />   
       <ajaxToolkit:ConfirmButtonExtender TargetControlId="DeleteButton" ConfirmText="Delete this entry?" />
   </ItemTemplate>   
</asp:TemplateField>  

Answer 3

This is a javascript for delete confirmation.

 function not_check1()
            {
              var where_to1= confirm("Do you really want to delete this record??");

                                    if (where_to1 == true)
                                        {
                                            return true;
                                        }
                                    else
                                        {
                                            return false;
                                        }
           }

---

This is a gridview field from where you call the javascript.

 <asp:TemplateColumn ItemStyle-Width="20" >
<ItemTemplate>
 <asp:ImageButton ID="ib_delete" runat="server" ImageUrl="~/image/images.jpg" commandName="Delete"  OnClientClick="return not_check1();" ImageAlign="Middle"/></ItemTemplate>

</asp:TemplateColumn>