Search code examples
csslaraveldatatablecolorscell

Laravel DataTables color cell based on value?

I am trying to color a cell using Laravel with DataTables based on the cell value, but i can't get the raw CallBack function working.

Here is code:

<script type="text/javascript">
$(document).ready(function() {
     $('#pdr_table').DataTable({
        "processing": true,
        "serverSide": true,
        "ajax": "{{ route('ajaxdata.getdata') }}",
        "columns":[
            { "data": "ID_Piece" },
            { "data": "Designation" },
            { "data": "Status" },
            { "data": "checkbox", orderable:false, searchable:false}
        ],
        'rowCallback': function(row, data, index){
            if(data[2] == 'Disponible'){
                console.log(data[2]); 
                $(row).find('td:eq(2)').css('background-color', 'green');
            }
        }
     });
});
</script>

enter image description here

Solution

  • You can inspect the console of your browser and it will show you the error which you can share here. On a first look at your code, before the rowCallback you are missing comma , after the columns item which will make the array to blow up. Second if you want to add a background color then you should use background-color css attribute because the color attribute will change the color of the text only.

    so data[2] should become data.Status when you are renaming the cells.