重新加载后比较数据表的数据，如果数据不变，则以红色突出显示行

Question

我有使用ajax.reload() 每 5 分钟重新加载一次的数据表。

此表有一行名为 CIP。

现在在每次重新加载时，我想突出显示值与上一个值相比没有变化的 CIP 行。（在之前的 ajax 调用中收到的值）。

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);
} );

Answer 1

你可以使用行回调https://datatables.net/reference/option/rowCallback

想法是，您存储上一个调用，然后使用行回调检查数据是否未更改（基于 SkillId 您检查先前的 Cip 值），然后添加一些特殊类，例如“未更改” ...

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

并且功能不变Cid 像：

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