TableSorterJS Reapply Default Filter Selections

Question

I set the default value of a filter as indicated below

            <th>Status</th>
            <th data-value="N">Complete</th>
            <th>Audit Date</th>

https://mottie.github.io/tablesorter/docs/example-widget-filter.html#filter-default-attrib

I also added a reset button with

    $(table).trigger('sortRestart').trigger('filterReset');
    $(this).addClass("toggled");

What I am trying to do is have another button to toggle the default search criteria back on.

So clicking the button once would clear the filters, clicking it again would reapply the filters. So far it seems like the button only goes one way.

Answer 1

There might be more elegant solutions to this problem, but I was able to do it with the below. This worked on a page with multiple tables.

$(document).on("click", ".clearFilterButton", function ()
{
    var table = $("#" + $(this).attr("data-table"));
    var toggled = $(this).hasClass("toggled");

    if (toggled)
    {
        table.find("th").each(function (index)
        {
            var defaultFilter = $(this).attr("data-defaultValue");
            if (defaultFilter != undefined)
            {
                table.find(".tablesorter-filter[data-column='" + [index] + ").val(defaultFilter);
            }
        });

        $(table).trigger('search', "");
        $(this).removeClass("toggled");
    }
    else
    {
        $(table).trigger('sortRestart').trigger('filterReset');
        $(this).addClass("toggled");
    }
});