Usando jQuery tableSorter en una tabla modificada dinámicamente

Question

Estoy usando el complemento jQuery tableSorter en una página.

Desafortunadamente, la tabla que se está ordenando se modifica dinámicamente, y cuando ordeno después de agregar un elemento, el elemento desaparece, restaurando la tabla al estado en que se encontraba cuando se creó el TableSorter.

¿Hay alguna forma en que pueda forzar a tableSorter a volver a escanear la página para que estos nuevos elementos se ordenen correctamente?

Answer 1

Creo que puedes activar una actualización usando algo como:

$(table).trigger("update")

Answer 2

Parece que estás en lo correcto.

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

hace el truco.

Como nota, la API del ordenador de tablas cambió en algún momento, por lo que se cambiaron estas cosas, así como el enlace de eventos. Mi mayor dificultad fue tratar de averiguar por qué algunas cosas funcionaron y otras no, y se debió a una versión incorrecta del complemento, a pesar de que no existía una distinción obvia.

Answer 3

El $ (table) .trigger (" update "); produce un error

    Uncaught TypeError: Cannot read property 'rows' of undefined 

Por lo tanto, hay una función jquery .ajaxStop () donde se llama a tablesorter () . No llame a tablesorter en .ready()

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

que hizo el trabajo

Answer 4

Para aquellos Newbies como yo que tienen problemas con la clasificación de tablas dinámicas generadas, aquí está la solución. La respuesta dada anteriormente es correcta, pero ¿dónde coloca este comando?

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

Debe colocarlo tan pronto como haya agregado los datos a la tabla. Ex en mi caso

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');