DataTables table plugin for jquery: how to set a css class for tr and td

Question

I am trying to set a css class to a row using the DataTables, query plugin for tables.

I managed to set the class on the tr tag when the initialization was complete with:

"fnInitComplete": function(oSettings) {
                                for (var i = 0, iLen = oSettings.aoData.length; i < iLen; i++) {
                                    oSettings.aoData[i].nTr.className = "myClass";
                                }
                            },

I want to set a callback for each new row, and set to tr class a and to td class b

I know how to add a class, and i need to set a class!

"fnRowCallback": function(nRow, aaData, iDisplayIndex) {
                                console.log(aaData);
                                $('tr', nRow).addClass('a');
                                $('td:eq(0)', nRow).addClass('b');
                                $('td:eq(1)', nRow).addClass('b');
                                $('td:eq(2)', nRow).addClass('b');
                                $('td:eq(3)', nRow).addClass('b');
                                return nRow;
                            },

this is what troubles me:

$('tr', nRow).addClass('a');

I don't know how to set a class to a tr tag.

Daniel · Accepted Answer · 2013-07-15 13:59:11Z

2

According to the docs (fnRowCallback) the nRow represents a TR element

so this should do:

$(nRow).addClass('a');

If you want to add class to certain row N# you can use this(just build a proper selector):

$("tr:eq(" + rowNumber+ ")").addClass('a');

the string should look like this "tr:eq(1)"

edited Jul 15, 2013 at 13:59

answered Jul 15, 2013 at 13:45

Daniel

37.2k10 gold badges123 silver badges208 bronze badges

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

1 Comment

Ionut Flavius Pogacian Over a year ago

yes, i also figured it out, later :)) it was nRow :)) because it's a callback :))

MonkeyZeus · Accepted Answer · 2013-07-15 13:45:37Z

1

If my understanding is correct then your issue might be in this line:

$('tr', nRow).addClass('a');

Because it equates to writing:

$(nRow).find('tr').addClass('a');

And you shouldn't be able to find a TR inside another TR (unless of course you are working with nested tables but we won't get into that)

If this is the case then your fix would be:

$(nRow).addClass('a');

Good Luck!

answered Jul 15, 2013 at 13:45

MonkeyZeus

20.8k4 gold badges41 silver badges83 bronze badges

Collectives™ on Stack Overflow

DataTables table plugin for jquery: how to set a css class for tr and td

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related