Question

I am new to jQuery!

I am having one table which load data from server using ajax\jQuery on every x seconds, data receiving in JSON format, My problem is that I want to update only particular cell if value is changed or new.. How do I compare old data with new data as new data are coming in JSON format and old data reside in tables…..

Here is my code:

window.setInterval(function() { 
    // this code will execute on every 5s 
    // so we could send an AJAX request to verify if we 
    // have new data. Example with jQuery: 
    $.getJSON('/foo', { }, function(result) { 

    }); 
}, 5000);

Answer 1

Use .data

window.setInterval(function() { 
    $.getJSON('/foo', { }, function(result) { 
        //Get the old data stored in the body using jquery data
        var old_data = $('body').data('my_data');
        //If objects are not the same, update cell
        if ( ! equal_objects(result, old_data) )
             update_cell();
        //Store the new data
        $('body').data('my_data',result);
    }); 
}, 5000);

OBS: equal_objects is a function you should implement to compare 2 objects since JavaScript doesn’t provide this functionality. See this post for details: Object comparison in JavaScript