In my form there there is a "Submit Button" and another Timer... Submit button submits a request that may take few minutes to serve..Mean while the timer would poll at short intervals (say 5 secs ) and keep the user updated.. But the issue is that timer stops polling as soon as the Submit button is clicked.. I am attaching the working sample code of the application..Does anyone know why this is happening..Thanks in advance.
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Submit_Click" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" Interval="700" runat="server" OnTick="UpdateTimer_Tick">
</asp:Timer>
</form>
</body>
Code Behind
protected void UpdateTimer_Tick(object sender, EventArgs e)
{
Debug.Write("Timer");
Label1.Text = DateTime.Now.ToString();
}
protected void Submit_Click(object sender, EventArgs e)
{
Debug.Write("Submit Start ");
for (int i = 0; i < 1000; i++)
{
Thread.Sleep(100);
}
Debug.Write("Submit End ");
}
I think the timer is stopped on postback (button-click) and will only start again when that postback returns. One solution to this is to use PageMethods instead of the timer, but you can only make static functions a PageMethod. For the example it would work like this:
[WebMethod()] public static string GetTime(){
Return DateTime.Now.ToString();
}
html and javascript (jquery):
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
</asp:ScriptManager>
<div>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Submit_Click" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<script type="text/javascript">
function OnSuccess(result, ctrl) { $('#<%=Label1.ClientID %>').html(result); }
function OnError() { alert("error!"); }
$(document).ready(function() {
setInterval(function() { PageMethods.GetTime(OnSuccess, OnError); }, 700)
});
</script>
</form>
</body>
Don't forget to set EnablePageMethods="true" when using webmethods!
While testing this I noticed the response was slower than the SetTimeout triggering a new ajax call, so the page rapidly builds up running connections, this might be because my development server is a bit slow. To fix this you should not update so frequently, once every 5 seconds will have to do.
I guess the asp.net timer already prevents this behavior: it stops when another ajax call is done. This behavior causes the problem you're experiencing, the button postback blocks the timer updates.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With