Background color of row with child details

mRender

Code:

<script type="text/javascript">

/* Formatting function for row details - modify as you need */
function format ( d ) {
    // `d` is the original data object for the row
    return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
        '<tr>'+
            '<td>Call Notes:</td>'+
            '<td>'+d.tbl_CallData.Notes+'</td>'+
        '</tr>'+
        '<tr>'+
            '<td>Note Date Time:</td>'+
            '<td>'+d.tbl_CallData.NotesDateTime+'</td>'+
        '</tr>'+
        '<tr>'+
            '<td>Email Of Employee:</td>'+
            '<td>'+d.tbl_Login.email+'</td>'+
        '</tr>'+
    '</table>';
}
 
$(document).ready(function() {
    var table = $('#managemycalls').DataTable( {
        dom: "frtip",
        pageLength: 25,
        type: 'POST',
        paging: true,
        info: false,
        idSrc: "tbl_CallData.CallID",
        ajax: "DataTables-1.10.0/extensions/Editor-1.3.1/examples/php/managemycallsdetails.php?SubscriberID=<? echo $subsub ?>",
        "fnServerParams": function ( aoData ) {
        aoData.push( { "name": "UID", "value": "<?php echo $UID; ?>" } );
        aoData.push( { "name": "SubscriberID", "value": "<?php echo $subsub; ?>" } );
        },
        "columns": [
            {
                "class":          'details-control',
                "orderable":      false,
                "data":           null,
                "defaultContent": ''
            },
            { data: "tbl_CallData.CallID" },
            {
            data: "tbl_CallData.CreateDate",
            render: function ( data, type, full, meta ) {
              return type === 'display' && data.length > 10 ?
                '<span title="'+data+'">'+data.substr( 0, 10 )+'</span>' :
                data;
            }
            },
            {
            data: "tbl_CallData.LastUpdateDate",
            render: function ( data, type, full, meta ) {
              return type === 'display' && data.length > 10 ?
                '<span title="'+data+'">'+data.substr( 0, 10 )+'</span>' :
                data;
            }
            },
            { data: "tbl_EmployerData.ClientName" },
            { data: "tbl_CallData.FollowUp"}
        ],
        "order": [[1, 'asc']]
    } );
     
    // Add event listener for opening and closing details
    $('#managemycalls tbody').on('click', 'td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );
 
        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child( format(row.data()) ).show();
            tr.addClass('shown');
        }
    } );
} );

</script>

The issue I'm having is that I cannot change the background color of a row when tbl_CallData.FollowUp = 1

I've tried:

"rowCallback": function( row, data ) {
             
            if ( data[ 5 ] == 1 )
            { $('td', row).css('background-color', 'blue');   }
},

And a couple of other code snippets that I've found. Nothing seems to work. If someone needs access to the website I can take out the login validation if it's necessary. Thank you for your help in advance.

allan

Seems to work for me: http://live.datatables.net/larureri/1/edit .

Can you modify my simple test case, or provide a simple test case, that shows the issue please.

Allan

mRender

Sent in message. Thanks.