需求:
1.对某一列进行动态更新。
2.不能对表格状态更改,如选中状态、当前页数、筛选等。
这样我们使用 draw 、ajax.reload 等都不能满足第二个需求。幸好发现一个api cell().data() 可以实现上面的需求。对此进行了封装来满足需求。
解决:
$.fn.dataTable.Api.register( 'partUpdate', function (col) { var api = this; var Sdata = api.data().data() $.ajax({ url: api.ajax.url(), data: api.ajax.params(), contentType: "application/json; charset=utf-8", dataType: "json", type: 'post', success: function (resp) { var data = resp.data; var error = resp.error; if (error!=null || error!=undefined){ alert(error) return false; } var field = table.column(col).dataSrc() $.each(Sdata, function(index, Sitem){ $.each(data, function(_i, item){ if(item!=undefined && item.id==Sitem.id){ if (Sitem[field]!=item[field]){ table.cell( index, col ).data(item[field]) } delete data[_i] return false; } }) }) } }) } );
我们注册api partUpdate,在内部ajax 访问数据源,将得到数据和原来数据进行对比,然后进行单元格更新。
测试效果图: