Как применить условное форматирование с помощью datatables.Яш?

У меня есть таблица html, которая использует datatables.js и не смогли найти четкий пример того, как применять Условное форматирование.

Как я могу изменить цвет текста ячейки в столбце 4, когда ее значение == 0 и значение в столбце 5!=0 

<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>
8
datatables jquery

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

демо -> http://jsfiddle.net/2chjxduy/

вы должны использовать fnRowCallback событие для этого. Из документов :

эта функция позволяет после обработки каждой строки после было генерируется для каждой таблицы draw, но перед ее отображением на экране. Эта функция может использоваться для установки имени класса строки и т. д.

Итак, в вашем случае сделайте следующее:

$("#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/

13