jQuery dataTables - updating class attribute of COLUMNS in dynamically added row

Question

I am using jQuery dataTables to add new rows dynamically. I am able to modify class attributes of the full row, but not columns therein.

In the below code I successfully set the css value to red and see the entire row with red font:

 var dataTableRow = ['c1', 'c2', 'c3', 'c4', 'c5', 'c6'];
 var newrow = $('#invoicetable').dataTable().fnAddData(dataTableRow);

 // set class attribute for the newly added row 
 var nTr = $('#invoicetable').dataTable().fnSettings().aoData[newrow[0]].nTr;

 // and parse the row:
 var nTds = $('td', nTr);


 nTds.attr('class', 'TMP');
 $('.TMP').css('color', 'red');

I recognize that nTds[] acts as an array containing columns of the row, but as simple a change as nTds[0].attr('class', 'TMP'); does not set just the 0th column to red font as I might expect.

Clearly I am missing something simple. Guidance appreciated.

Nope · Accepted Answer · 2013-01-27 16:43:57Z

2

nTds[0].attr() won't work as attr is a jQuery method and nTds[0] returns the actual HTML element without the jQuery wrapper.

If you want to target a single element using jQuery syntax you can use eq(), similar to this:

nTds.eq(0).attr('class', 'TMP') //or 
nTds.eq(0).addClass('TMP')

answered Jan 27, 2013 at 16:43

Nope

22.4k8 gold badges50 silver badges73 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

goldfinger Over a year ago

But then will class 'TMP' be applied to ALL tds? I want to set class 'TMP' for only the 0th column (in this example - in other code may want to specify 1st, 2nd etc). Point here is column-level/td-level control, not tr-level.

Nope Over a year ago

@goldfinger: Apologies for the miss-read on my behalf. I updated my answer to use eq() instead.

Collectives™ on Stack Overflow

jQuery dataTables - updating class attribute of COLUMNS in dynamically added row

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related