Postback from jQuery Modal Dialog by invoking ASP.NET Button Click

Question

I have a ASP.NET web forms application. I am trying to show a Modal Dialog for confirmation when user clicks on Submit button. I am using OnClientClick of the Button to call a JavaScript function. The function opens the modal dialog if Page Validation is successful. When the user clicks on Yes button of modal dialog, I want the form to be submitted. I tried _doPostback(btn, 'OnClick'), btn.trigger('click') and btn.click(). I can see the modal dialog and the Cancel button works. But when I click on Yes, Page is not Posting. Please see the below code and help me. Thanks!

ASPX:

<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click"
    OnClientClick="clientValidate();return false;"/>

<div id="alert" style="display: none">
    Are you sure you want to submit?
</div>

JavaScript:

$(document).ready(function () {
        $('#alert').dialog({
            title: 'Confirm',
            modal: true,
            autoOpen: false,
            buttons: {
                Yes: function () {
                    var btn = document.getElementById('<%=btnSubmit.ClientID%>');
                    //_doPostback(btn, 'OnClick');
                    //btn.trigger('click');
                    //btn.click();
                    // Above three didn't work! :(
                },
                Cancel: function () {
                    $(this).dialog('close');
                }
            }
        });            
    });

function clientValidate() {
        var btnsubmit = document.getElementById(<%=btnSubmit.ClientID%>);
        if (Page_ClientValidate()) {                                
            $('#alert').dialog('open');
        }
    }

UPDATE:

Corrected _doPostBack() to __doPostBack(). The page posts now. But btnSubmit_Click in not getting called.

Gjohn Gjohn · Accepted Answer · 2014-11-21T22:47:55

Your doPostBack call is wrong. It should be __doPostBack() not _doPostBack() - there are supposed to be two underscores, you have one. Which is probably why it failed to begin with.

Try this instead:

buttons: {
            Yes: function () {
                var btn = document.getElementById('<%=btnSubmit.ClientID%>');
                __doPostback(btn, 'OnClick');
            },

UPDATE

Try this:

In your code behind add this in your page load function

if (Page.IsPostBack)
{
    var param = Request["__EVENTARGUMENT"];
    if (target == "Submit")
      btnSubmit_Click(sender, e);
}

In your Javascript you would do

__doPostBack(btn, 'Submit');

That should do it.

Postback from jQuery Modal Dialog by invoking ASP.NET Button Click

1 Answers