0

i am trying to make an auto refresh json which is reloading for changes every 5 seconds. It loads perfectly first time on load but my setinterval is not working correctly. It goes of every 5 seconds but it doesnt update my menu even though changes has been made? .

Here is what i got so far:

 $(document).ready(function(load) {

    var dmJSON = "example.com";

    $.getJSON( dmJSON, function(data) {


    setInterval(function () {
      $(news).html(""); 
      $.getJSON();         
    }, 5000);

    var html = '';

 // loop through all the news items, and append the 
 // title and published date to the html variable.

 for(var i = 0; i < data.feed.data.length; i++){

    html += '<div style="width: 600;direction: rtl;background-color: white;padding: 12px 12px 0;border: 1px solid;border-color: #e5e6e9 #dfe0e4 #d0d1d5;border-radius: 4px;margin-bottom: 20px;color: black;">';

    html += '<span style="/* text-align: left; */direction: rtl;position: absolute;left: 250px;"> ' + data.feed.data[i].created_time + ' </span><span><img alt="" src="http://icons.iconarchive.com/icons/gakuseisean/ivista-2/128/Network-Globe-Disconnected-icon.png" style="background-size:auto;background-repeat: no-repeat;display: inline-block;height: 20px;width: 20px;position: absolute;left: 490px;padding-top: 9px;" /></span>' ;

    html += '<br>' ;

    html += data.feed.data[i].message ;

    html += '<p><img alt="" src=' + data.feed.data[i].picture + ' /></p>';

    html += '</div>';

 }

 // append all the html variable to the ticker div.
    $("#news").append(html);
 });

 });

i use this code but when refresh he give my empty page

setInterval(function () {
  $(news).html(""); 
  $.getJSON();         
}, 5000);
6
  • var dmJSON = "https://"; why is url empty? Commented Dec 16, 2015 at 11:06
  • 1
    I think you need to call getJSON with arguments. In your setInterval callback you are calling it without any argument. Commented Dec 16, 2015 at 11:07
  • @JohnnyAW i have the url but am delete Commented Dec 16, 2015 at 11:08
  • ach ok, could write something like example.com Commented Dec 16, 2015 at 11:08
  • Also, why are you setting the interval inside the getJSON callback as well? setInterval, unlike setTimeout, will repeat the callback function call every n seconds. Commented Dec 16, 2015 at 11:08

1 Answer 1

1

Try this:

$(document).ready(function(load) {

 var dmJSON = "https://";
 function fetch() {
   $.getJSON( dmJSON + (+new Date()), function(data) {
     $("#news").html('');
     var html = '';

     // loop through all the news items, and append the 
     // title and published date to the html variable.

     for(var i = 0; i < data.feed.data.length; i++){

         html += '<div style="width: 600;direction: rtl;background-color: white;padding: 12px 12px 0;border: 1px solid;border-color: #e5e6e9 #dfe0e4 #d0d1d5;border-radius: 4px;margin-bottom: 20px;color: black;">';

         html += '<span style="/* text-align: left; */direction: rtl;position: absolute;left: 250px;"> ' + data.feed.data[i].created_time + ' </span><span><img alt="" src="http://icons.iconarchive.com/icons/gakuseisean/ivista-2/128/Network-Globe-Disconnected-icon.png" style="background-size:auto;background-repeat: no-repeat;display: inline-block;height: 20px;width: 20px;position: absolute;left: 490px;padding-top: 9px;" /></span>' ;

         html += '<br>' ;

         html += data.feed.data[i].message ;

         html += '<p><img alt="" src=' + data.feed.data[i].picture + ' /></p>';

         html += '</div>';

      }

      // append all the html variable to the ticker div.
      $("#news").append(html);
   });
 }
 setInterval(fetch, 5000);// call fetch every 5 seconds
 fetch(); // call fetch first time
});
Sign up to request clarification or add additional context in comments.

4 Comments

sounds good, but I would empty html after the data is arrived, not before json-call
Also, check the API call status code and response. Status code 304 indicates a cached response. To explicitly clear it you can do one thing. In the URL that you are hitting append the timestamp parameter every time the call happens. This will ensure that the call response is not cached.
@JohnnyAW his work , and am waiting to see the new update without reload
@aligassan it will work, but you may have several seconds empty screen, until ajax got you the data

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.