Adding new rows to a jQuery TableSorter with Pager

Posted by macca1 on Stack Overflow See other posts from Stack Overflow or by macca1
Published on 2010-04-14T21:08:33Z Indexed on 2010/04/14 21:13 UTC
Read the original article Hit count: 406

Filed under:
|
|
|
|

I have a basic table with the jQuery tableSorter on it in addition to a filter and pager:

$("#myTable")
        .tablesorter({ debug: false, widgets: ['zebra'] })
        .tablesorterFilter({ filterContainer: $("#filterBoxOne"),
            filterClearContainer: $("#filterClearOne"),
            filterColumns: [0, 1, 2],
            filterCaseSensitive: false
        })
        .tablesorterPager({ container: $("#pagerOne"), positionFixed: false });

I'm trying to dynamically add a whole bunch of rows to it:

function addRows() {
    $("#myTable tbody").append( $("#newRows").html() );
    $("#myTable").trigger("update")
                 .trigger("applyWidgets");
                 //.trigger("appendCache"); //tried this, didn't help
}

Everything is working fine except for the pager: it doesn't get updated when I add more rows, and upon clicking on one of the buttons (first, next, last, etc), the newly added rows disappear.

Is there a way I can remove the pager and re-add it? Or is there some other way to achieve this?

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about tablesorter