Search code examples
javascriptjqueryfiltertablesorter

Tablesorter Custom Filter Function - Full Table Filter


I have a tablesorter, with 2 filter Columns. The first Filter works as a drop down and has no issues right now. The second filter is intended to be a full table search and filter mechanism.

That is to say, even though it is associated with the computer column, it should return results for child rows as well enter image description here

The Computer Filter should respond to all child rows. For instance, if I searched for z840, , only Computers with Model z840 should appear.

However, I have a custom secondary filter mechanism by request The gauge at the top, works as a filter for workgroup

However, If I am filtered in a workgroup, and use the Computer Filter, it ignores the custom hidden rows, and searches against any row in the table. (Child Row Searching works fine).

My Question is, Is there a way to overwrite the functionality of the filter, to ignore any rows that are already satisfying some condition IE: $(row).hasClass('hide')

I have tried using filter_functions but every result ends up searching on computer name only

I am using Jinja Templating so it was a little hard to get a fiddle up and running but here is a sample.

http://jsfiddle.net/brianz820/856bzzeL/813/

Sort by wg02 (at top, no results), and then use the computer filter to search for say, 3.3. No results show up, but once you delete the search, the original workgroup filter is removed.

On my production copy, even typing 3.3 would have returned results for any workgroup, ignoring the filter.

There may be lots of extraneous code on Fiddle, just wanted to get a working version up

Thanks for reading, Goal to maintain free form child searching and filtering on filter selection, but maintain external hidden rows.

if there is any more required information please let me know


Solution

  • I'm not exactly sure if this is what you meant, but the hideRows function can be simplified by using the filter widget (demo):

    function hideRows() {
        var $table = $('.tablesorter'),
        filters = $.tablesorter.getFilters( $table );
      filters[2] = selected === 'All' ? '' : selected;
      $.tablesorter.setFilters( $table, filters );
    }