Confirm Dialog before submitting form in ASP.NET

Question

I have a button which will show a confirm dialog when I click. I use this http://myclabs.github.io/jquery.confirm/ Plugin. When I click the button, a pop up appears. But there's nothing happening even when I click on Yes.

         $(document).ready(function () {

            $('#btnDelete').confirm({
                title: "Delete confirmation",
                text: "Are you sure?",
                confirm: function (button) {
                    //$(button).submit();
                    return true;
                },
                cancel: function (button) {
                    return false;
                },
                confirmButton: "Yes I am",
                cancelButton: "No",
                post: true
            });

        });

My ASP.NET code looks like this.

<asp:Button ID="btnDelete" CssClass="btn btn-default" runat="server"  />

Note: There is already code behind function which handles Click event of btnDelete.

Answer 1

I've solved the problem in a different way with Bootstrap modals. More examples are here.. http://getbootstrap.com/javascript/#modals-examples

The modified delete button..
When I click on this 'Delete' button, it calls a model named "deleteModal".

<asp:Button ID="btnDelete" CssClass="btn btn-default" runat="server" 
            data-toggle="modal" data-target="#deleteModal" />

DeleteModal-Popup has Yes/No buttons. I've registered a click event on the "Yes" button.

<!--Popup Ja-Button-->
<asp:Button ID="btnDeleteConfirm" CssClass="btn btn-danger" runat="server"/>

That's it. It works fine.

Answer 2

My guess is your ClientIDMode isn't set to Static. Therefore your HTML item does not have an id of btnDelete. It's probably container_container_contatin_etc._btnDelete

If you change your selector from

$('#btnDelete')

to

$('input[id$=btnDelete]')

It'll probably work. Without your HTML though this is a bit of a guess.

Jquery selector here