Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ajax timer not polling when another request is being served

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   ");
        } 
like image 983
Ananth Avatar asked Dec 11 '25 15:12

Ananth


1 Answers

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.

like image 131
Willem Avatar answered Dec 14 '25 04:12

Willem



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!