Question

I need to retrieve JSON data from a URL periodically, and update my page accordingly.

I have a table. Each row has a link that I would link to test its status say, every 20 seconds.

This could be achieved using a page refresh meta tag, but I think ajax would be a much nicer solution.

Should I be using $.getJSON? (im pretty new to ajax/json)

Answer 1

You’re basically there. First of all, $.getJSON() is just a convenience method to $.ajax() where the datatype: 'json', and it’s a best practice to always stick with $.ajax(). You want to call setTimeout within the function that you want to asynchronously load – so you’ll be using recursion here. The benefit is that you can repeatedly make your AJAX call, but only when the previous method is completed, so everything operates correctly. A quick example of this would be something like the following:

$(function() {
    var myFunction = function() {
        $.ajax({ 
            url: '/place-for-cool-stuff', 
            datatype: 'json',
            data: { ... data you need to send, e.g. method arguments ... }
         }).done(function (data) {
             ... do stuff with the data you get back ...
         }).fail(function (jqXHR) {
             ... be smart and handle failures ...
         }).always(function () {
             ... no matter what happens do this stuff ...
             setTimeout(myFunction, 20000);
         });
     };
});