user2190943
user2190943

Reputation: 15

jquery tablesorter: updating headers

The table headers will change depending on dynamic ajax updates. When doing this using:

$('table thead').html(headers);

and then re-initialising the table using:

$("table").tablesorter({ theme : 'blue', sortList: [[2,1],[0,0]] });

The ability to sort is removed from the headers. How can I update the headers and re-initialise it so that those headers are treated correctly?

Upvotes: 1

Views: 1130

Answers (1)

Mottie
Mottie

Reputation: 86413

I think in your case you might need to destroy the instance of tablesorter before re-initializing it:

// initialisation
var initOptions = {
  theme: 'blue',
  sortList: [[2,1],[0,0]]
};
$("table").tablesorter(initOptions);

Then after the ajax update, use:

// Remove tablesorter and all classes
$("table").trigger("destroy", [false, function(){
  // callback after the destroy method
  $('table thead').html('<tr>' + headers + '</tr>');
  $("table").tablesorter(initOptions);
}]);

In this example, make sure the initOptions variable is within the same closure as the initialisation code, or just duplicate it ;)

Upvotes: 1

Related Questions