我有一个使用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>
解决方法
更新.最初的答案是针对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') } } })
演示 – > http://jsfiddle.net/2chjxduy/
您应该使用fnRowCallback
事件.来自文档:
This function allows you to ‘post process’ each row after it have been
generated for each table draw,but before it is rendered on screen.
This function might be used for setting the row class name etc.
所以在你的情况下,这样做:
$("#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中看到它的实际作用 – > http://jsfiddle.net/GfNeA/