Highlight selected row

nycos62

Hello,

can we highlight the selected row ?

I use a button on the last cell of each row to edit the record in the row ( in a panel under the datatable )
when I click this button, I change the class of the edited record like this

(I'm using the ID property of the row)

$('#myDataTable > tbody  > tr').each(function () { $(this).removeClass("focusedRow") });
$('#' + RowID).addClass("focusedRow");

here the css class :

.focusedRow 
{
    font-weight: bold;
    text-shadow: 1px 1px 0px #EEE;
    color: #111;    
}

with that I know which row is or has been edited.

But, when I use paging, and change current displayed page, the focusedRow class is keeped in the previous displayed page.
So when I navigate between pages, a previous focusedRow is steel displayed as edited even if I have edited another row in another page

What can I do to clear the classes 'focusedRow' in the non displayed pages ? please help...

allan

The Select extension has built in row highlighting when you select a row - example.

Allan

nycos62

thank you !!

the only thing I need is to initialize the DataTable with these data :

(my button is on the last cell of each row)

select: {
                style: 'os',
                className: 'focusedRow',
                selector: 'td:last-child a'
            },