kayra
kayra

Reputation: 218

jquery datatable.net change row color based on value of cell

I want to change color of row in jquery datatable.net based on row's column value in fnRowCallback but its not working. Can any one help?

var xref_table = $('#grid_table').dataTable({
            "bStateSave": true,
            "bDestroy": true,
            "bJQueryUI": true,
            "sAjaxSource" : 'include/admin/xref_topic_product_add.php?grid=1',
            "aoColumns": [
                { "mDataProp": "topic_name",sWidth:'200px' },
                { "mDataProp": "product_name", sWidth: '100px'},
                {   
                    "mDataProp": "product_id" , 
                    fnRender: function(row) 
                    {
                        if( row.aData.product_id === null)
                            return '<button class="add_button" data_topic_id="'+ row.aData.topic_id + '" data_product_id="'+ row.aData.product_id + '" >Add</button>';
                        else
                            return '<button class="delete_button" data_topic_id="'+ row.aData.topic_id + '" data_product_id="'+ row.aData.product_id + '" >Delete</button>';


                    }, 
                    sWidth: '50px'
                },
            ],
            "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
                if(aData[3] === null){
                     $(nRow).css({"background-color":"red"});
                   }
                    return nRow;
                }

        });

Upvotes: 2

Views: 4899

Answers (1)

myfunkyside
myfunkyside

Reputation: 3950

Normally you can change the bg-color like this:

$(nRow).css("background-color","red");

or

$(nRow).css("background-color","#ff0000");

I don't know if nRow holds a correct representation of the element though, I can't see that here, that's your responsibility.

Upvotes: 3

Related Questions