Utilisation de jQuery tableSorter sur une table modifiée dynamiquement

Question

J'utilise le plugin jQuery tableSorter sur une page.

Malheureusement, la table en cours de tri est modifiée dynamiquement et lorsque je trie après avoir ajouté un élément, celui-ci disparaît, ce qui rétablit l'état de la table lors de la création de la tableSorter.

Existe-t-il un moyen de forcer tableSorter à analyser de nouveau la page afin que ces nouveaux éléments soient triés correctement?

Answer 1

Je pense que vous pouvez déclencher une mise à jour à l'aide de quelque chose comme:

$(table).trigger("update")

Answer 2

Vous semblez avoir raison.

$(table).trigger("update");
$(table).trigger("appendCache");

fait le tour.

En guise de remarque, l'API tablesorter a changé à un moment donné. Ces éléments ont donc été modifiés, ainsi que la liaison d'événement. Mon plus gros problème consistait à essayer de comprendre pourquoi certaines choses fonctionnaient et d'autres pas, en raison d'une mauvaise version du plugin, même s'il n'y avait pas de distinction évidente.

Answer 3

Le $ (table) .trigger ("update"); génère une erreur

    Uncaught TypeError: Cannot read property 'rows' of undefined 

Donc, il existe une fonction jquery .ajaxStop () où tablesorter () est appelé. Ne pas appeler tablesorter dans .ready ()

    jQuery(document).ajaxStop(function(){
      jQuery("#table_name").tablesorter();
    })

qui a fait le travail

Answer 4

Pour les débutants comme moi confrontés à un problème de tri de la table générée dynamique, voici la solution. Les réponses précédentes sont correctes, mais où placez-vous cette commande?

$('#tableId').tablesorter().trigger('update');

Vous devez le placer dès que vous avez ajouté les données à la table. Ex dans mon cas

var tableData = "<thead><tr><th>Name</th><th>Age</th></thead><tbody><tr><td>Izaki</td><td>24</td><tr><tr><td>Serizawa</td><td>25</td></tr>";
$('#tableId').html('tableData');
$('#tableId').tablesorter().trigger('update');