jQuery Ajax setTimeout JSON - PullRequest
Новая
       1

jQuery Ajax setTimeout JSON

2 голосов
/ 18 ноября 2011

Я использую JQuery AJAX для вызова службы JSON. Затем я выкладываю данные в .html. Я бы хотел, чтобы произошло 2 вещи. 1. Я хочу обновить кнопку, чтобы обновить данные, а не всю страницу. 2. Я хочу, чтобы setTimeout или setInterval (который когда-либо работал лучше всего) обновляли данные каждые 5 минут или около того. Но обновите страницу. Как бы я обернуть AJAX в setTimeout или setInterval или обновить данные с помощью кнопки и таймера каждые 5 минут или около того. Я знаю, что это должно быть просто, но я не смог заставить его работать. Заранее спасибо.

Ниже мой код. 

    $.ajax({

    type: "POST",
    url: "/myservice.asmx/WebMethod",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (msg) {
      var myval = msg.d;
      // $('#jsonstring').html(myval);
      var obj = jQuery.parseJSON(myval);
      $('#Data1').html(obj.DataOne);
      $('#Data2').html(obj.DataTwo);

    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.statusText);
        alert(xhr.responseText);
        alert(xhr.status);
        alert(thrownError);
    }
});

Ответы [ 4 ]

1 голос
/ 19 ноября 2011

Это то, что я сделал. Из этого поста я также узнал, что интервал или тайм-аут будет зависеть от загрузки данных и нагрузки. поэтому я должен был написать это так. 

  function myFunction() {
     $.ajax({
        type: "POST",
        url: "/myservice.asmx/WebMethod",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
           var myval = msg.d;
           // $('#jsonstring').html(myval);
           var obj = jQuery.parseJSON(myval);
           $('#Data1').html(obj.DataOne);
           $('#Data2').html(obj.DataTwo);

           //TO SET THE TIMEOUT FOR DATA TO LOAD

           setTimeout(function(){
              yourFunction();
           }, 300000);
        },
        error: function (xhr, ajaxOptions, thrownError) {
           alert(xhr.statusText);
           alert(xhr.responseText);
           alert(xhr.status);
           alert(thrownError);
        }
     });
  }

  $(document).ready(function(){
     //Load on Doc Ready
     myFunction();

     //Reload on button click
     $('#myBtn').click(function(){
        myFunction();
     });

     //TO SET THE TIMEOUT FOR DATA TO LOAD - Need both in the success and here.

     setTimeout(function(){

        myFunction();

     }, 2000);
  });
0 голосов
/ 18 ноября 2011

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

function Refresh() {
    /* your ajax code */
}

setInterval(Refresh, 300000); // five minutes, in milliseconds

$("#MyButton").click(Refresh);
0 голосов
/ 18 ноября 2011 
function refreshContent() { 
    $.ajax.....
}   

function refreshContentTimer() { 
    refreshContent();
    setTimeout(refreshContentTimer, 300000); // 5 min
}

$(function () {

    setTimeout(refreshContentTimer, 300000); 
    $("#refreshButton").click(refreshContent);

}
0 голосов
/ 18 ноября 2011 
function rData(){
    $.ajax({

        type: "POST",
        url: "/myservice.asmx/WebMethod",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
          var myval = msg.d;
          // $('#jsonstring').html(myval);
          var obj = jQuery.parseJSON(myval);
          $('#Data1').html(obj.DataOne);
          $('#Data2').html(obj.DataTwo);

        },
        error: function (xhr, ajaxOptions, thrownError) {
            alert(xhr.statusText);
            alert(xhr.responseText);
            alert(xhr.status);
            alert(thrownError);
        }
    });
}

setInterval(rData,300000);

<input type='submit' value='refresh' onclick='rData();return false;'>
...