Search code examples
c#jqueryasp.netdopostback

Prevent Full Postback from __doPostBack


I have a content page that contains the following...

  1. UpdatePanel1 - containing Error Display Divs
    contains update triggers for both buttons
  2. UpdatePanel2 - containing process 1 with an asp:button
  3. updatePanel3 - containing process 2 with an asp:button
  4. JavaScript that presents the user with a Popup confirm Jquery Messagebox based on the process they are executing.

UpdatePanel 2 or 3 becomes visible based on the users selection from the menu options.

selecting menu item 2 will display this page shown with an error message

When I click a button the messagebox pops and the page is processed correctly using __doPostback from the messagebox response and the page does a full postback.

I would rather the page do a partial postback and the content it had and display the Error Display Divs if there was an error. Any assistance would be appreciated.

nothing special about the button

<asp:Button ID="ResetSomething" runat="server" Text="ResetSomething" Width="275px" />

here is the content page script block

    <script type="text/javascript" language="javascript">
<!--
    function pageLoad() {
        setform();

    };

    function setform() {
        var reset1_button = $('input[id*=ResetSomething]');
        var reset2_button = $('input[id*=ResetSomethingElse]');

        reset1_button.click(function() {
            var element = $(this);
            $.prompt('Message1', { show: 'slideDown', buttons: { Ok: true, Cancel: false },
                submit: function(v, m, f) { submit_reset_callback(v, m, element); }
            });
            return (false);
        });

        var submit_reset_callback = function(result, messages, element) {
            if (result) { __doPostBack("ResetSomething");}
            return (false);
        };

        reset2_button.click(function() {
            var element = $(this);
            $.prompt('Message2', { show: 'slideDown', buttons: { Ok: true, Cancel: false },
                submit: function(v, m, f) { submit_update_callback(v, m, element); }
            });
            return (false);
        });

        var submit_update_callback = function(result, messages, element) {
            if (result) { __doPostBack("ResetSomethingElse"); }
            return (false);
        };
    };     
-->
</script>

this is the code behind for the OnInit:

    protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);
        this.PreLoad += (sender, args) =>
                            {

                                this.ClientScript.GetPostBackEventReference(this, "arg");

                                if (!IsPostBack) { return; }

                                string __targetaction = this.Request["__EVENTTARGET"];
                                string __args = this.Request["__EVENTARGUMENT"];

                                if (string.IsNullOrEmpty(__args)) return;

                                if (__targetaction == "ResetSomething")
                                {
                                    ResetSomething();
                                }
                                if (__targetaction == "ResetSomethingElse")
                                {
                                    ResetSomethingElse();
                                }
                                this.upnlNotifications.Update();
                            };
    }

Solution

  • Define the function below and replace your __doPostBack calls with doPostBackAsync(controlId, null).

    function doPostBackAsync(eventName, eventArgs) {
        var prm = Sys.WebForms.PageRequestManager.getInstance();
    
        if (!Array.contains(prm._asyncPostBackControlIDs, eventName)) {
            prm._asyncPostBackControlIDs.push(eventName);
        }
    
        if (!Array.contains(prm._asyncPostBackControlClientIDs, eventName)) {
            prm._asyncPostBackControlClientIDs.push(eventName);
        }
    
        __doPostBack(eventName, eventArgs);
    }