How to continue with asp.net server side button click method after interaction wtih jQuery UI Dialog?

Question

From a jQuery noob, any help is appreciated with this as I've wasted too much time already with a deadline fast approaching.

The lowdown - I have an asp.net form in an intranet engineering application that needs to pop up a jQuery dialog when the Submit button is pressed in certain circumstances.

In the "certain circumstances" the user needs to confirm a question and the form needs to continue with submission including executing the server-side code for the Submit button's Click event.

When the "certain circumstances" don't exist, the form needs to simply submit and execute the server-side code for the Submit button's Click event. (Same as above, but with no jQuery Dialog.)

The challenge seems to be:

• When the dialog closes, the form submits but it is obviously *not* as if the original Submit button caused it since the only server-side code being executed is `Page_Load`. The `cmdSave_Click' (which is what I also need to execute) is not called.

Here is the dialog box definition. (On both button clicks I need to stick a value in a hidden field that the server-side cmdSave_Click method ultimately needs.)

var dlgTidPopup = $('#popupPnlTid').dialog({
    resizable: false,
    autoOpen: false,
    draggable: false,
    modal: true,
    closeOnEscape: false,
    title: 'Request for Target Identifier (TID)?',
    buttons: {
        "yes": function () {
            $('#txtTidYes').val("1");
            $('#userInputForm').unbind("submit").submit();
            $(this).dialog('close');
        },
        "no": function () {
            $('#txtTidYes').val("0");
            $('#userInputForm').unbind("submit").submit();
            $(this).dialog('close');
        }
    }
});

dlgTidPopup.parent().appendTo($('form:first'));

Here is the submission portion. The if statement determines the appearance of the dialog to satisfy the "is this that certain circumstance?" requirement.

$('#userInputForm').submit(function (event) {
    if ($('#hdnSituationIsTid').val() == "1") {
        event.preventDefault();
        $('#popupPnlTid').dialog("open");
    }
});

The submit button looks like:

<asp:ImageButton ID="ibtnSend" ImageUrl="../_common/Images/buttons/Send.gif"
  runat="server" OnCommand="cmdSave_Click" CommandName="Send" CssClass="majorButton"
  CausesValidation="false" />

The answer to this is probably so simple and I am just lacking in knowledge. Any guidance is greatly appreciated. (Also, do know that I've scoured SO and read many, many posts and have even modeled my code after many of them, but I haven't quite found a resolution to my specific question.)

Answer 1

See my answer on the question linked below, I use a hidden asp:button for the callback:

ASP.NET with jQuery popup dialog: how to post back on dialog closing

 function showjQueryUIDialogOkBtnCallback(buttonToClick, dialogSelector, buttonTxt, isModal, width, height) 
   {
       var buttonOpts = {};
       buttonOpts[buttonTxt] = function () {
           $("#" + buttonToClick).trigger('click');
       };

       buttonOpts['Cancel'] = function () {
           $(this).dialog("close");
           $(this).dialog('destroy'); 
       }

       $(dialogSelector).dialog({
           resizable: false,
           height: height,
           width: width,
           modal: isModal,
           open: function (type, data) {
               $(this).parent().appendTo("form"); //won't postback unless within the form tag
           },
           buttons: buttonOpts

       });

       $(dialogSelector).dialog('open');

    }