Tablesorter - Update Filter header DropDown after Appending Table Row

Question

I have a tablesorter table that looks like below.

As you can see, the "License" Filter, has 2 entries.

If I dynamically add a row so that the table looks like below.

I have tried updating the table using

$('#connectionGrid2').trigger('updateAll', [false]); $('#connectionGrid2').trigger('updateCache', [false]); $('#connectionGrid2').trigger('update', [false]);

Yet these updates do not get the new value to appear in the dropdown.

Is it possible to update the filter header dropdown without reinitallizing the tablesorter?

Answer 1

Please check to make sure you're using the most up-to-date version.

Otherwise, everything appears to be working as expected in this demo

$(function () {
    $('table').tablesorter({
        theme: 'blue',
    widgets: ['filter']
    });
  $('button').click(function(){
      var row = [
        '<tr>',
          '<td>Lisa</td>',
          '<td>Chemistry</td>',
          '<td>Female</td>',
          '<td>99</td>',
          '<td>99</td>',
          '<td>99</td>',
          '<td>99</td>',
        '</tr>'
      ].join('');
      $('tbody')
        .append($(row))
        .trigger('update');
  });
});

If you are still having issues, please modify that demo to duplicate the problem to make troubleshooting it easier. Thanks!