Как отключить / включить контроль таймера asp.net с помощью Javascript?

Question

Как отключить / включить управление таймером asp.net с помощью Javascript Мой код: (но не работает)

 function timeroff() 
 {
      var b = document.getElementById('Timer1');
      if (b) {
            b.disabled = true;
        }
    }
    function timeron() {
        var b = document.getElementById('Timer1');
        if (b) {
            b.disabled = false;
        }
    }

Answer 1

Это позволяет пользователю переключать управление таймером ASP, используя ТОЛЬКО JavaScript.

Я расширяю это, но пока, это прекрасно работает ... если я хочу отключить таймер и не иметьобновлять панель обновления во время работы, это здорово, но не элегантно, но работает.

Обратите внимание, это работает с панелью обновления и таймером с именем ID = tmrFillAlerts (см. код ниже) ... Я перечисляюсамое основное ... Я вынул CSS и форматирование, чтобы было легче следовать, но со всем, что включено, это выглядит так ...

Переключатели выглядят так, когда страница загружается и вынажмите кнопку пользователя с запущенным таймером ...

Затем, после нажатия "Turn update OFF" выше, вы увидите это, и таймер остановится...

Вы можете увидеть приведенные выше «Включение или выключение обновлений» в приведенном ниже коде как ID = lblFlyOutTimerStatus ниже.Кроме того, красный шарик ВКЛ / ВЫКЛ выше находится ниже как ID = lblAlertsTotal.

Когда обновления включены ... и вы нажимаете кнопку "Белл" или кнопку "Информация", вы получаете всплывающее окно, подобное этому, благодарятаймер, и он обновляется каждые 60 секунд в моем случае (это показывает всплывающее окно звонка)

Код позади C # ...

// Loads the DataList from the TIMER component
private void udpAlertBar(object sender, EventArgs e) {
    // Do whatever you want here on timer tick ... 

    // Write the last BELL alert time...
    lblAlertTime.Text = "Last update time:<br/>" + DateTime.Now.ToString("MM/dd/yyy hh:mm:ss tt");
    // Load the BELL and INFO icon drop down lists
    FillBellInfoDataLists();
    // Update red alert ballz .... 
    UpdateAlertBallTotals();
}

Код страницы ASP ...

<asp:UpdatePanel id="udpAlertItemUpdater" runat="server">
  <ContentTemplate>
     <!-- NOTE: The update panel must wrap just this area (UPDpnl kills the javascript for some reason otherwise)  -------->
     <asp:Label id="lblTimerState" runat="server" Text="on" />
        <ul>
         <li>     
           <a href="javascript:void(0)" onclick="toggleUpdateTimer()"> 
            <asp:Label ID="lblFlyOutTimerStatus" runat="server" Text="Turn updates OFF" />         
           </a>
         </li>
        </ul>
        <asp:Timer ID="tmrFillAlerts" runat="server" OnTick="udpAlertBar" Interval="60000" Enabled="true"/>
  </ContentTemplate>
</asp:UpdatePanel>

Код JavaScript ...

<script type="text/javascript">
    function toggleUpdateTimer() {
        // Gets the timer control on the page named “tmrFillAlerts” 
        var timerState = $find(“tmrFillAlerts”);
        // Gets the label I use for an alert ball on an icon on the page …
        var timerStatusRedAlertBall = document.getElementById(‘lblTimerState’);
        // Gets the menu item I have on the alert icon that drops down when clicked …
        var timerStatusFlyOutLabel = document.getElementById(‘lblFlyOutTimerStatus’);
        // Toggle the timer when the menu item is clicked ….
        if (timerState.get_enabled() == true) { 
            stopUpdateTimer(); // NOTE: stop the timer, then disable …
            timerState.set_enabled(false);
            timerStatusRedAlertBall.innerHTML = “OFF”;
            timerStatusFlyOutLabel.innerHTML = “Turn Updates ON”;}
        else { 
            timerState.set_enabled(true); // NOTE: Enable the timer, then start ….
            startUpdateTimer();
            timerStatusRedAlertBall.innerHTML = “on”;
            timerStatusFlyOutLabel.innerHTML = “Turn Updates OFF”;}
    }

    function stopUpdateTimer() {
            var timer = $find(“tmrFillAlerts”);
            timer._stopTimer();
    }

    function startUpdateTimer() {
            var timer = $find(“tmrFillAlerts”);
            timer._startTimer();
    }
</script>

Я убрал все, кроме соответствующих элементов, чтобы он заработал ... в противном случае это было бы длиной в десять страниц !!

В настоящее время работает для меня во всех браузерах с IIS 8.5, работающим на .NETver: 4.0.30319.42000

Это незавершенная работа, которая была быстро сделана, но я нашел кое-что классное, что я поделился.Надеюсь, поможет!

Удачи !!

Answer 2

Следующее работает, пока таймер не находится на главной странице, потому что вы получите сообщение об ошибке «Невозможно изменить коллекцию элементов управления, так как элемент управления содержит блоки кода (т.е. <% ...%>).]»когда вы помещаете этот javascript в заголовок главной страницы.

    function enableTimer() {
    var timer = Sys.Application.findComponent(‘<%= Timer1.ClientID %>’);
        timer.set_enabled(true);
    }
    function disableTimer() {
        var timer = Sys.Application.findComponent(‘<%= Timer1.ClientID %>’);
        timer.set_enabled(false);
    }

см. http://weblogs.asp.net/andrewfrederick/controlling-the-asp-net-timer-control-with-javascript для получения более подробной информации