External tablesorter filter: load two datasets

Question

I have two seperate Questions for the mottie tablesorter script: I have created external buttons to filter the table beforehand. When you click, the data in question is loaded. However, each time you load one of the datasets, I would love to also load the elements under „base“. So load two data-filter-text and not one.

So it would be Alabama + Base, Alaska + Base and so on.

External Filter Buttons:

<button type="button" data-filter-column="0" data-filter-text="Alabama" class="changebnd">Alabama</button>
<button type="button" data-filter-column="0" data-filter-text="Alaska" class="changebnd">Alaska</button>
<button type="button" data-filter-column="0" data-filter-text="Arizona" class="changebnd">Arizona</button>
<button type="button" data-filter-column="0" data-filter-text="Arkansas" class="changebnd">Arkansas</button>
<button type="button" data-filter-column="0" data-filter-text="Base" class="changebnd"> Base </button>

Script that initiates table load:

$('button[data-filter-column]').click(function() {
var filters = [],
    config = $table[0].config,
    $t = $(this),
    col = $t.data('filter-column'), 
    txt = $t.data('filter-text') || $t.text(); // text to add to filter
    filters[col === "all" ? config.columns : col] = txt;
    $.tablesorter.setFilters( $table, filters );
    return false;           
});

https://mottie.github.io/tablesorter/docs/example-widget-filter-custom-search.html

Answer 1

I've finally found a simple answer myself. All my rows have a class based on the elements inside.

The row for base looks like this:

<tr class="Base filtered" role="row"></tr>

I'm using the class filtered to target this row specifically.

$('button[data-filter-column]').click(function() {
var filters = [],
    config = $table[0].config,
    $t = $(this),
    col = $t.data('filter-column'), 
    txt = $t.data('filter-text') || $t.text(); // text to add to filter
    filters[col === "all" ? config.columns : col] = txt;
    $.tablesorter.setFilters( $table, filters );
 
    //new row
    $('tr.Base').removeClass('filtered');

    return false;           
});