Question

I’m using the tablesorter(http://tablesorter.com) jquery plugin to sort table data… Does anyone know if its possible to change the color of the entire column on click? Even if it isn’t with this plugin, some other way?

Thanks,
Mike

Answer 1

Looking at the docs you linked to they mention a couple of triggers that fire when sorting starts/stops. Which are connected by binding them to the table.

var table=$('#myTable').tablesorter();
table.bind('sortEnd', updateCells);

Looking at the code they use in their examples I see that the sorted header has a class ‘headerSortUp’ or ‘headerSortDown’. From here we find out which <th> has one of these classes and highlight its column cells.

function updateCells(){
  var sortHead=$('.headerSortUp, .headerSortDown', table).get()[0],
  index=$('th', table).index(sortHead);

  if (index>=0){
    $('td', table).removeClass('selected');
    $('tr', table).each(function(){
     $('td:eq('+index+')', this).addClass('selected');

    });

  }
}