Highlight row based on active link

NathanSF

I have seen quite a few posts on row highlighting, but not quite what I'm looking for. I have a DT and one column has links that use javascript to load a report into an area on a portion of the screen (the portion of the screen is beside the DT). A user can click the link in any row, and the report data that displays in the window changes based on the link selected. I would like to highlight the row that is active (the one that was clicked last to show the current display data).

Could I add a class to each row with the row number? Then add a click handler to each link so I can highlight the row via css?

Thanks for any insight, seems easy-ish but have been stuck on this for a few.
Nathan

allan

> I would like to highlight the row that is active (the one that was clicked last to show the current display data).

Can you not just add a class to the TR element that was clicked on? http://datatables.net/release-datatables/examples/api/select_single_row.html

You could even use TableTools for this as it has a row selection option and API to give you the selected row(s).

Allan

NathanSF

"Can you not just add a class to the TR element that was clicked on? http://datatables.net/release-datatables/examples/api/select_single_row.html"

Thanks for the response. This solution highlights the row if I click anywhere in the row beside the link. If I click on the link within the row, the row is not highlighted.

NathanSF

Figured it out. Had to use $(event.target.parentNode.parentNode).addClass('row_selected'); since the parentNode of the link was the .

allan

[code]
$(this).parents('tr').addClass(...)
[/code]

might be a slightly cleaner way of doing it and more flexible for future DOM changes :-).

Allan