Question

我有一个使用datatables.js的html表，并且无法找到如何应用条件格式的明确示例。

当值== 0且第5列中的值为！= 0时，如何更改第4列中单元格的文本颜色

<script>
      $(document).ready(function () {
        $("#GeneratedData").dataTable({
          "sDom": 'T<"clear">lrtip',
          "oTableTools": {
            "sSwfPath": "http://localhost:5637/Content/swf/copy_csv_xls_pdf.swf"
          },
           "sPaginationType": "full_numbers"
        });
      })
</script>

Answer 1

<强>更新即可。最初的答案是针对dataTables 1.9.x.它仍然有效，并且也适用于dataTables 1.10.x（到目前为止），但这里是纯dataTables 1.10.x版本：

var table = $('#example').DataTable({
  rowCallback: function(row, data, index) {
    if (data[3]=='0' && data[4]!='0') {
      $(row).find('td:eq(3)').addClass('color')
    }   
  }
})

演示 - ＆gt;的 http://jsfiddle.net/2chjxduy/

您应该使用fnRowCallback事件。来自文档：

此功能允许您在每行后“发布” 为每个表绘制生成，但在屏幕上呈现之前。此函数可用于设置行类名等。

所以在你的情况下，这样做：

$("#GeneratedData").dataTable({ //your settings as above here fnRowCallback: function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { if ($(nRow).find('td:eq(3)').text()=='0' && $(nRow).find('td:eq(4)').text()!='0') { $(nRow).find('td:eq(3)').addClass('color'); } } });

color是一个预定义的CSS类。在这个jsfiddle中看到它的实际效果 - ＆gt; http://jsfiddle.net/GfNeA/

如何使用datatables.js应用条件格式？

1 个答案: