Disabling and re-enabling an asp.net Timer control using JavaScript

Question

I have an ASP.Net web page which contains an ASP:Timer control

<asp:Timer ID="TimerRefresh" runat="server" Interval="5000" Enabled="true" OnTick="TimerRefresh_Tick">
</asp:Timer>

This is linked to by an asp:UpdatePanel in the page, so that a particular portion of the page is refreshed asynchronously.

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <div class="TopRow" id="TopRowPlace" runat="server">
     ... More HTML Code here...
        </div>
    </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="TimerRefresh" />
        </Triggers>
</asp:UpdatePanel>

The issue is that the DIV tag containing the HTML which is updated asychronously can be hidden (by setting the display property to none in the style) when a user performs certains actions. When this happens there is no need for the content to be updated, because it is hidden.

Is there a way in JavaScript to disable the timer from running and doing the asynchronously post-back, and indeed, re-enabling it when the DIV tag is made visible again?

Answer 1

I've looked at the JavaScript added to the BODY.onload event by a Timer on one of my WebForms. I don't think it would be easy to modify unless you really want to get into overriding the Timer's properties (and mix it with more client side JavaScript). So, what happens in your DIV when you say:

...which is updated asychronously can be hidden (...) when a user performs certains actions.

Are the actions performed on the server? If so you could just disable the timer on the server in response to the events in the DIV.
I've got a UpdatePanel in a WebForm with a CheckBox; the CheckBox AutoPostBacks and has a CheckedChanged event handler. If the CheckBox is checked, the Timer is enabled and the UpdatePanel's content gets updated on each tick - if the CheckBox is not checked the Timer is disabled. The AutoPostBack works even if the Timer is disabled.
If you are using client side JavaScript in your DIV I still think that the AutoPostBack would be the easiest solution.