DataTables: How to set classes to table row cells (but not to table header cells!)

Question

i have a really nice style for my tables.

{ sorry links no more working }

I had to add sClass so that new rows (added by fnAddData) get the right classe

Answer 1

Set the default classes before.

$.fn.dataTableExt.oStdClasses.sStripeOdd = '';

$.fn.dataTableExt.oStdClasses.sStripeEven = '';

For further references see here http://www.datatables.net/styling/custom_classes

Answer 2

Solution to my problem was: useing fnRowCallback instead of sClass to set classes to new rows.

  var rolesTable = $('#roles').dataTable({
      "aoColumns": [
        { "mDataProp": "id" },
        { "mDataProp": "name" },
        { "mDataProp": "module" },
        { "mDataProp": "description" },
        { "mDataProp": null, "bSearchable": false, "bSortable": false, 
          "sDefaultContent": '<button type="button" name="add" class="btn btn-round"><i class="icon-plus icon-white"></i></button>' }, 
      ],
      "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
          $('td:eq(0)', nRow).addClass( "avo-lime-h avo-heading-white" );
          $('td:eq(1),td:eq(2),td:eq(3)', nRow).addClass( "avo-light" );
        }
  }); // end od dataTable

Answer 3

  let table = $("#myTable").dataTable();
  table.rows().every(function(rowIdx, tableLoop, rowLoop){
    $(this.node().cells[0]).addClass('red');
    $(this.node().cells[1]).addClass('blue');
  }

After the table is rendered, iterate through all rows with the JavaScript selector of each row and make whatever changes you want. This addresses the performance concerns brought up by gamliela in loostr's answer. DataTables rows().every() documentation

Answer 4

Since you are only using sClass to apply styling to the table the simple solution to your problem is to modify the CSS itself to only apply to the td elements.

Old CSS style:

.avo-light {
    color: blue;
}

New CSS style:

td.avo-light {
    color: blue;
}

This way the CSS will only effect the cells you are interested in applying the style to despite sClass being applied to th elements as well.

I realize this question is a little old, but I find it substantially more modular than the best solution.