jquery: reload multiple divs on page with ajax on interval X

Question

Im in the need to update several #divs on a page by using AJAX to call a function in my web app that returns a value. The value is a counter the idea is to update it in realtime this way.

function getTime(ID) returns = "12.00"

What would be a good way to implement this in query?

Im using below snippet to reload a section of a page but how to do this with multiple sections? any query guru's can help me on the right way? thx!

:javascript
  var refreshId = setInterval(function() {
      $("#basket").load('/gettime/<id value from id attribute to pass it???>');
      }, 10000);
      $.ajaxSetup({ cache: true });

did you see this: http://stackoverflow.com/questions/4193736/auto-refresh-multiple-divs-with-jquery — Sudhir Bastakoti, Jul 03 '12 at 11:38

score 2 · Accepted Answer · answered Jul 03 '12 at 11:44

2

Well, one way you can do it is, use one class , say "reload" to all the divs that needs to be reloaded, set unique ids to those divs and do something like:

$('body').on('reloadTimeout', 'div.reload', function(event){
    //get the div id using 
    var divId = $(this).attr("id");
    //then do some ajax stuff like load to fetch content
});
window.setInterval(function(){ 
    body.trigger('reloadTimeout'); 
}, 30000);

Hope it helps

answered Jul 03 '12 at 11:44

Sudhir Bastakoti

99,167
15
158
162

Thx I tried but $('body').on('reloadTimeout', 'div.timer', function(event){ doesn't seem to be valid query? – Rubytastic Jul 03 '12 at 14:16
Used the idea and it works reasonable well with a conversation to query – Rubytastic Jul 04 '12 at 18:12

jquery: reload multiple divs on page with ajax on interval X

1 Answers1