Compare data of datatables after reload and highlight row in red if data is unchanged

271 Views Asked by At

I have datatable that is being reloaded on every 5 minuts using ajax.reload().

This table has a row named as CIP.

Now on each reload I want to highlight the CIP row where value is unchanged from last value.(Value received on previous ajax call).

function getSkillStats() {
     table = $('#example').DataTable( {
         "ajax": {
             "type" : "GET",
             "url" : "../SkillStateManagement",
             "dataSrc": function ( json ) {
                 //Make your callback here.
                 return json.data;
             }       
         },
         colReorder: true,
         scrollY: "600px",
         scrollX: false,
         scrollCollapse: true,
         paging: false,
         select: true,
         'columnDefs': [
            { width: 50, targets: 0 },
            { width: 50, targets: 1 },
             {
                'targets': 0,
                'checkboxes': {
                   'selectRow': true
                }
             }
          ],
          fixedColumns: true,
          processing:true,
          "language": {
              "loadingRecords": ' ',
              processing: '<i class="fa fa-spinner fa-spin fa-3x fa-fw"></i><span class="sr-only">Loading..n.</span> '
          },   
         columns: [
             { "data" : "calls_Failed" },
             { "data" : "queuer_Threads" },
             { "data" : "calls_In_Progress" },
             { "data" : "skill_Id" },
             { "data" : "calls_Connected" },
             { "data" : "sys_Busy" },
             { "data" : "max_Cip" },
             { "data" : "queuer_name" }
         ]

     } );         
} 


$(document).ready(function () {

    getSkillStats();
    setInterval(function () {
        table.ajax.reload();
    }, 300000);
} );
1

There are 1 best solutions below

1
Mohamed23gharbi On BEST ANSWER

you can use row callback https://datatables.net/reference/option/rowCallback

The idea, is that you store the previous call and then use the row callback to check if data was unchanged (based on skillId you check the previous Cip value), then if it is you add some special class like "unchanged" ...

 $('#example').dataTable( {
  ....
  "rowCallback": function( row, data ) {
    if (unchangedCid(data[4], data[7]) ) {
      $('td:eq(7)', row).addClass("unchanged"); // unchanged should be defined in css
    }
  }
} );

and with function unchangedCid like :

var unchangedCid = function(id, cid) {
   // search logic goes in search function ...
   if(search(id) = cid) {
      return true;
   }
   return false;
}