2013-09-26 8 views
2

Я использую MVC с некоторыми частичными рендерингами и ajax-вызовами. В одной из моих таблиц результатов у меня есть поле, которое является таймером.setInterval javascript calls не исчезают после загрузки ajax

Следующий код на моем частичном изображении, который отображается каждые 30 секунд. Одно из полей является активным таймер, который показывает пользователю:

<td><div id="@someID" class="nobutton"></div><script>setInterval(function() { startTimer('@startDateTime', '@someID') }, 500);</script></td> 

Это прекрасно работает, но после того, как вызов Ajax сделан, чтобы обновить частичное, интервальной функции по-прежнему называя старые удостоверения личности (someID), что больше нет.

Вот Javascript для таймера:

<script type="text/javascript"> 
    function startTime(dt, field){ 
     var field = document.getElementById(field); 
     if (field == null) 
      return; 

     var rowTime = new Date(dt); 
     var rowTimems = rowTime.getTime(rowTime); 

     var currentTime = new Date(); 
     var currentTimems = currentTime.getTime(currentTime); 

     var difference = currentTimems - rowTimems; 

     var hours = Math.floor(difference/36e5), 
      minutes = Math.floor(difference % 36e5/60000), 
      seconds = Math.floor(difference % 60000/1000); 

     field.innerHTML = formatTime(hours) + ":" + formatTime(minutes) + ":" + formatTime(seconds); 
</script> 

и вызов на главной странице, которая обновляет парциальное довольно прост:

var t = setInterval(function() { 
      $.ajax({ 
       url: "MYURL", 
       type: "GET", 
       cache: false, 
       success: function (data) { 
        $("#summary").html(data);      
       } 
      }); 
     }, 30000); 

Есть ли способ, чтобы убить Старожилы? Почему они все еще работают?

+1

Необходимо снова очистить интервал перед повторным обновлением ajax. – PSL

ответ

2

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

<td><div id="@someID" class="nobutton"></div> 
<script> 
if(window.prtInt != void 0) clearInterval(window.prtInt);//void 0 means undefined 
window.prtInt = setInterval(function() { startTimer('@startDateTime', '@someID') }, 500); 
</script></td> 

Если вы хотите, чтобы очистить все таймеры на всей странице (может быть нежелательным влияет), то вы можете получить целое число для нового таймера, и цикл до этого числа клирингового интервалы, которые все еще присутствуют.

<script> 
function clrTimers(){ 
    var clr = setTimeout(function(){},10); 
    for(var i = 0; i < clr; i++){ 
    clearInterval(i); 
    } 
} 
</script> 

Если вы хотите пропустить некоторые из них, вы можете включить их с ключевым словом continue, если бы знали их. Такие как

for(var i = 0; i < clr; i++){ 
if(i == t) continue; //I believe t was your ajax interval variable 
clearInterval(i); 
} 
+0

Я думаю, что это будет отлично работать, если у меня будет только 1 ряд данных. Есть ли способ очистить все интервалы? –

+0

@PapaBurgundy - есть. Тем не менее, это также очистит таймер для вызова ajax, который вы делаете. См. Мое редактирование выше. –

+1

Я закончил объявление массива javascript на главной странице и добавил идентификатор целого числа SetInterval в массив, когда он строит каждую строку. Затем при перезагрузке ajax я clearInterval для любого ID в массиве. Ваш ответ заставил меня возглавить в этом направлении, спасибо. –

2
setInterval(function() { startTimer('@startDateTime', '@someID') }, 500); 

будет продолжать выполнять те же значения, пока он не будет очищен с clearInterval(). Чтобы очистить его, вам необходимо сохранить его var и передать его функции clearInterval().

+0

спасибо. этот ответ дал мне правильный путь. –

Смежные вопросы