Highlight Cell on click

Ali Adnan

I am using this https://editor.datatables.net/examples/advanced/multiItem.html example and I have hardtime to figureout a small problem.

On "Select Event" I am trying to highlight "Cell" but it is not happening.

Invoice_Table.on('select', function (e, dt, type, indexes) {
                //Below Line working fine with Row Selection
                Invoice_Table[type](indexes).nodes().to$().addClass('DTTT_selected');
            });

Invoice_Table.on('deselect', function (e, dt, type, indexes) {
                //Below Line working fine with Row Selection
                Invoice_Table[type](indexes).nodes().to$().removeClass('DTTT_selected');
            });

Please help me to add same class on cell selection

allan

Does the DTTT_selected class get access to the cell? Do you have CSS for that (that is the legacy class name used for the old TableTools plug-in, which was row based and didn't have an option for just cells).

Can you link to a page showing the issue please?

Allan

Ali Adnan

Hi Allan,
Thanks for reply, actually I am using "DataTables" with "SmartAdmin" https://wrapbootstrap.com/theme/smartadmin-responsive-webapp-WB0573SK0 Template and by default due to some css confilict on row click it was not "highlighted" so that I use "select" and "deselect" event to add /remove "DTTT_selected" class and it was working fine when I select row and as you said it was based on old table tools
The css I found in "SmartAdmin" .css files

/*
 * SELECTING
 * Row selection styles
 */
table.DTTT_selectable tbody tr {
  cursor: pointer;
  *cursor: hand;
}
table.dataTable tr.DTTT_selected.odd {
  background-color: #9FAFD1;
}
table.dataTable tr.DTTT_selected.odd td.sorting_1 {
  background-color: #9FAFD1;
}
table.dataTable tr.DTTT_selected.odd td.sorting_2 {
  background-color: #9FAFD1;
}
table.dataTable tr.DTTT_selected.odd td.sorting_3 {
  background-color: #9FAFD1;
}
table.dataTable tr.DTTT_selected.even {
  background-color: #B0BED9;
}
table.dataTable tr.DTTT_selected.even td.sorting_1 {
  background-color: #B0BED9;
}
table.dataTable tr.DTTT_selected.even td.sorting_2 {
  background-color: #B0BED9;
}
table.dataTable tr.DTTT_selected.even td.sorting_3 {
  background-color: #B0BED9;
}

Ali Adnan

Dear Allan,
This problem has been solved by adding the select extension .css and .js files previously .css file was missing