how to change color of some lines dynamically depending on some criteria

trucmuche2005

Hello,

I have two datatables. In the first one, I have three columns : id1, name1, tag1. In the second one, I have three columns : id2, name2, tag2. Those datatables are filled using "row.add()" method on the page loading.
The "tag1" & "tag2" columns are filled with numbers. All of this works perfectly :-)

Now, when the user clicks on a line of the table1 (hence select a id1, name1 and tag1 entry), I would like that lines in table2 whose "tag2" is equal to the "tag1" become written in bold & red. Thus I would like to change dynamically the style of some table2 lines depending on a criteria (tag2 equal to selected tag1). Is that possible ? and how ?

Many thanks in advance !

T.

allan

Use the jQuery $().addClass() and $().removeClass() methods along with a $().click() event listener if this only occurs on a user click. You would use exactly the same approach as if you were not using DataTables.

Allan

trucmuche2005

Thank you for your anwser. I understood how to get the row content when I click on a datatable line, I understood how to change the style of a datatable line (didn't tried yet) BUT the problem I have now is to change style of all lines in table2 where the third column ("tag2") belongs to a given array (like ["1", "27", "253"]).

Explicitely : when I click on the table1, I get an array with numbers in $tag1 variable. This array could be Array("1", "27", "253") for instance. This works. Now, I would like to change the style of all the lines in table2 if their third column ("tag2") is equal to 1, 27 or 253.

How can I achieve this ?

Thanks again !

trucmuche2005

I tried
var names = table2
.rows( function ( idx, data, node ) {
return (ecolesFrequentees.indexOf(data[3])>-1);
} )
.data();
and it gets the correct lines in table2 but now, I would like to change their style... I'm stuck...

allan

I would like to change their style...

Use rows().nodes() to get the nodes and then either add a class for a specific style or just add the style directly.

$( table.rows( ... ).nodes() ).addClass( '...' );

Allan

trucmuche2005

Thank you very much !!