Conditional Formatting

jh_dempsey

Hi All

I want to set the colour of a row based upon the value of one of the cells in the row

I know I need to use rowCallback function to do this:
the https://datatables.net/reference/option/rowCallback

Problem is, being new to JavaScript and jQuery (though I am familiar with PHP) I'm really struggling to insert the example code into my code without getting syntax errors.

Below is my javascript code what I have at the moment to get my dataTable up and running. How do I modify this to include the callback function?!

<script type="text/javascript">

var resultTable;

$(document).ready( function () {
    
    resultTable = $('#clash_results').DataTable({
        ajax: {
            url: 'ajax_get_clash_results.php',
            dataSrc: ''
        },
        columns: [
        { data: 'clash_group_name' },
        { data: 'test' },
        { data: 'cway_side' },
        { data: 'chainage' },
        { data: 'status' }
        ]
        
    });
    
}); // End of (document).ready function ()

</script>

This is the code I want to use. Ive copied it from rowCallback reference page but modified it to what I want to do. I justneed to know how or whereto put this in the above code!!!

$('#example').dataTable( {
  "rowCallback": function( row, data, index ) {
    if ( data.status == "Active" ) {
      $('td:eq(4)', row).addClass('active');
    }
  }
} );

allan

var resultTable;

$(document).ready(function() {
  resultTable = $("#clash_results").DataTable({
    ajax: {
      url: "ajax_get_clash_results.php",
      dataSrc: ""
    },
    columns: [
      { data: "clash_group_name" },
      { data: "test" },
      { data: "cway_side" },
      { data: "chainage" },
      { data: "status" }
    ],

    rowCallback: function(row, data, index) {
      if (data.status == "Active") {
        $("td:eq(4)", row).addClass("active");
      }
    }
  });
}); // End of (document).ready function ()

This part of the manual might help.

Allan

jh_dempsey

Got it working :-)

I defiantely had it like that at one point but for some reason the addClass("active") part didn't seem to be working for me, even though I had a .active entry in my CSS
Switched it to

$(row).css('background-color','#99ff9c')

and everything worked :-)