using update panel do sync job , update UI control async

Scenario :


1.click submit disable button ,start job 
2.once job done , enable submit button




Here is the implementation :


Aspx page Code :




Step 1: add update panel and script manager

  <form id="form1" runat="server">     <asp:ScriptManager ID="ScriptManager" runat="server">        </asp:ScriptManager>        <asp:UpdatePanel ID="AsynUpdatePanel" runat="server" UpdateMode="Conditional">            <ContentTemplate>            <!--<span class="code-comment"> Here on click is a long running operation e.g. 30 secs --></span>                <asp:Button ID="Submit" runat="server" OnClick="Submit_Click" Text="Submit" />                            </ContentTemplate>        </asp:UpdatePanel>    </form>

Step 2: add javascript 

 <script type="text/javascript">        Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(startRequest);Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest); function startRequest(sender, e) {document.getElementById("<%=Submit.ClientID%>").disabled = true;        }function endRequest(sender, e) {            document.getElementById("<%=Submit.ClientID%>").disabled = false;        }    </script>

Step 3:


Code behind :

//Simulate a long time task protected void Submit_Click(object sender, EventArgs e)        {            Thread.Sleep(2000);        }