Javascript Before Asp:ButtonField Click

I have a GridView control in an Asp.net application, that has a of type='image' and CommandName='Delete'. Is there any way to execute a piece of javascript

Solution 1:

I would use a TemplateField instead, and populate the ItemTemplate with a regular asp:Button or asp:ImageButton, depending one what is needed. You can then execute the same logic that the RowCommand event was going to do when it intercepted the Delete command.

On either of those buttons I would then use the OnClientClick property to execute the JavaScript confirm dialog prior to this.

<script type="text/javascript">
   function confirmDelete()
   {
       return confirm("Are you sure you want to delete this?");
   }
</script>

...

<asp:TemplateField>
  <ItemTemplate>
     <asp:ImageButton ID="DeleteButton" runat="server"
        ImageUrl="..." AlternateText="Delete" ToolTip="Delete"
        CommandName="Delete" CommandArgument='<%# Eval("ID") %>'
        OnClientClick="return confirmDelete();" />
  </ItemTemplate>
</asp:TemplateField>

Solution 2:

I found that the most elegant way to do this is to use jQuery to wire the onClick event:

<script type="text/javascript"> 
    $(".deleteLink").click(function() {
      return confirm('Are you sure you wish to delete this record?');
    });
</script>

...

<asp:ButtonField ButtonType="Link" Text="Delete"
    CommandName="Delete" ItemStyle-CssClass="deleteLink" />

Notice that I use an arbitrary CSS class to identify the link button.

Solution 3:

In the GridView's RowCreated event handler, use FindControl to find the named button, and add to the Attributes collection:

btn.Attributes.Add("onclick", "return confirm('delete this record?');");

Your ASP.Net code will only be executed if confirm() is true, i.e. has been ok'd.

Solution 4:

So I have a javascript function:

function confirmDeleteContact() {
  if (confirm("Are you sure you want to delete this contact?")) {
    document.all.answer.value="yes";
  } else {
    document.all.answer.value="no";
  }
}

and I wire it to a grid item like so:

Sub dgbind(ByVal sender As Object, ByVal e As DataGridItemEventArgs) Handles dgcontacts.ItemDataBound
    Select Case e.Item.ItemType
        Case ListItemType.Item, ListItemType.AlternatingItem
            CType(e.Item.Cells(9).Controls(0), System.Web.UI.WebControls.LinkButton).Attributes.Add("onclick", "javascript:confirmDeleteContact();")
    End Select
End Sub

This is some old code, so I see a few things I could change up, but the moral is this: If all else fails, add the javascript "onClick" during row binding. "document.all.answer.value" is a hidden field that has runat=server so that I can read the value upon postback.

Solution 5:

better for you the add reference System.Windows.Forms if you use buttonfield... It is always available in all .net framework and supports asp.net..

this is your choice if the buttonfield is your best choice.. sample:

using System.Windows.Forms;

protected void BorrowItem_RowCommand(object sender, GridViewCommandEventArgs e)
{

    if (e.CommandName == "Delete")
    {

        if (System.Windows.Forms.MessageBox.Show("Do you want to delete", "Delete",MessageBoxButtons.OKCancel, MessageBoxIcon.Question, MessageBoxDefaultButton.Button1, MessageBoxOptions.ServiceNotification) != System.Windows.Forms.DialogResult.OK)
        {
            return;
         }
     }
//Continue execution...
}

//drimaster