Change TR class based on data

organicspider

Hello,

First of all must say what an awesome piece of code this is :)

Now the question ... I am trying to highlight a row based on a value from returned data in an external script. Here is the code I have so far[code]
$(document).ready(function() {
$('#asterisk-cdr tbody tr').each( function() {
var sClass;
var nTds = $('td', this);
var sDirection = $(nTds[6]).text();

if ( sDirection == "0" )
sClass = "inbound";
else
sClass = "outbound";
this.setAttribute( 'class', sClass );
} );

$('#asterisk-cdr').dataTable( {
"bProcessing": true,
"bServerSide": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"aoColumnDefs": [ { "sClass": "center", "aTargets": [ 0, 1, 2, 3, 4, 5, 6 ] } ],
"aoColumns": [ null, null, null, null, null, null, { "bVisible": false } ],
"sAjaxSource": "/media/php/cdr.php"
} );
} );[/code]The sixth field in the recordset is 'direction' which can be either 0 or 1. I am guessing where setAttribute is called I should be using something else other than class ?

organicspider

Hmmm, I have changed the variable sClass, as it was conflicting, to sClassDirection and found the jQuery command addclass. Changed the code to[code]$('#asterisk-cdr tbody tr').addClass( sDirectionClass );[/code]but that still does not work :(

organicspider

Ah, looking at firebug it would indicate that this is only being called on the initial load and not when the table has been fully populated; so all it is seeing is "Loading Data". How would one make it a post initialisation event please ?

organicspider

Okay I managed to work it out by reading some other posts :) So in the spirit of helping others who have helped me he is the complete code[code]
$(document).ready(function() {
$('#asterisk-cdr').dataTable( {
"bProcessing": true,
"bServerSide": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"aoColumnDefs": [ { "sClass": "center", "aTargets": [ 0, 1, 2, 3, 4, 5, 6 ] } ],
"aoColumns": [ null, null, null, null, null, null, { "bVisible": false } ],
"sAjaxSource": "/media/php/cdr.php",
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
var sDirectionClass;
if ( aData[6] == "0" )
sDirectionClass = "inbound";
else
sDirectionClass = "outbound";

$(nRow).addClass( sDirectionClass );
return nRow;
}
} );
} );
[/code]

thecompanymerchant

organicspider

Many thanks for this. As no one else responded you could have just left the question open, but your answer meant that I found your solution to my problem within minutes. Many thanks

Tony