Disallowing POST BACK when one is already in progress

Question

Disable a post back from asp.net i.e. buttons, links, gridview page index changing and sorting etc when a post back is already in progress. Target browser is IE 6+. I've written these 2 javascript I am not sure how to apply it on GridView Page Index changing.

<script type="text/javascript">
          //isFormSubmitted variable is used to prevent the form submission while the server execution is in progress
          var isFormSubmitted = false;
          //If the form is already submitted, this function will return false preventing the form submission again.
          function SubmitForm(msg)
          {
            try {
             if(isFormSubmitted == true)
             {
               alert('A post back is already in progress. Please wait');
               return false; 
             }
             else 
             {
               var res = false;
               if (msg)
               {
                 res = confirm(msg);
               }
               if (res == true)
               {  
                 isFormSubmitted = true;
               }
               return res;
             }
           } catch(ex) {}
          }

          function VerifySubmit()
          {
             if(isFormSubmitted == true)
             {
               alert('A post back is already in progress. Please wait');
               return false; 
             }
             else 
             {
               isFormSubmitted = true;
               return true;
             }
          } 
</script>

For buttons I can attach the SubmitForm to OnClientClick like this.

<asp:Button ID="btnCancel" runat="server" CssClass="button" Text="Cancel" OnClick="btnCancel_Click" OnClientClick="return SubmitForm('Do you want to continue with cancelling recent action?');" />

But I am not sure how to attach the VerifySubmit to non prompting controls like gridview pager.

Answer 1

If you want to disable post back set autopastback=false for buttons links. Otherwise you need to give us more information and better instructions / details to help you out.

Answer 2

 onclick="this.disabled=true;"

on your submit-button(s) is all the javascript "magic" you need

When jQuery is an option you can use this small script to disable all submit-buttons:

// Find ALL <form> tags on your page
$('form').submit(function(){
    // On submit disable its submit button
    $('input[type=submit]', this).attr('disabled', 'disabled');
});

Found here: http://jquery-howto.blogspot.com/2009/05/disable-submit-button-on-form-submit.html

Or you can block the whole page: http://jquery.malsup.com/block/#page

Answer 3

I'm going to guess that you're doing ajaxy type stuff here and you have an async-postback going and you don't want the user to click a button at that time.

If that is the case then try the following code:

    Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(startRequest);
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest);

    function startRequest(sender, e) {
        //disable search button during the AJAX call
        document.getElementById('<%=btnSearch.ClientID%>').disabled = true;

    }

    function endRequest(sender, e) {
        //re-enable the search button once the AJAX call has completed
        document.getElementById('<%=btnSearch.ClientID%>').disabled = false;
    }

Answer 4

The easiest solution I found is that..

//In the head section define this script...

    <script type="text/javascript">
      function ShowProcessingMsg(confirmMsg) {
        var resp = confrim(confirmMsg);
        try {
          if (resp == true) {
            var divC = document.getElementById('<%= divControls.ClientID %>');
            var divM = document.getElementById('<%= divProcessingMsg.ClientID %>');
            if (divC && divM) {
              divC.display = "none";
              divM.display = "block";
            }
            else {
              return false;
            }
          }
        } catch (exp) { alert(exp); return false; }
        return resp;
      }
    </script>

//This div will show during processing since by default it's display is none when after
//Post back your page loaded again this will not be diplayed. We are going to set it's
//diplay attribute to block from javascript.

<div id="divProcessingMsg" runat="server" display="none" z-index="1000" />
   <b>Processing.... Please wait.</b>
</div>


//We will hide this div from script by setting its display attribute to none. Since 
//by default this attribute is block when the page loaded again it'll be displayed by 
//default. So no special handling for setting display again to block is required.

<div id="divControls" runat="server" display="block" z-index="1" />
   <asp:GridView ............ >
   .....
   .....
   .....
   <asp:Button runat="server" id="btnProcess" Text="Process" OnClientClick="return ShowProcessingMsg('Do you want to continue with processing'); OnClick="btnProcess_ServerClick" />
</div>

Answer 5

We all need to upgrade ourselves with the fast pacing technological era

Answer 6

Keeping up the pace of the fast moving technological world is essential to live in this innovative age.

Answer 7

Match the speed of the fast moving world otherwise you will have to lag behind.