Tablesorter sort; multiple checkboxes, multiple columns

Question

I\'ve got a tablesorter running almost the way I would like it, there is just one more thing that I don\'t know how to do.

Right now, I have table in which you can s

Answer 1

All that you need to do is comment out, or remove, one line - filters.val('');:

Here is the code, and a demo (I added clear buttons to each set as well to allow clearing a filter column)

$('button.search').click(function() {
    var filters = $('table').find('input.tablesorter-filter'),
        col = $(this).data('filter-column'),
        txt = $(this).data('filter-text');
    // filters.val('');
    filters.eq(col).val(txt).trigger('search', false);
});

---

Also, this code requires my fork of tablesorter in order to work. Here is the code for others that might be interested:

HTML example:

Netherlands
Belgium
Germany
Clear



    ...

  

  

    

      
Event
      
Date
      
Duration
      
Place
      
Country
      
Genre(s)
    
  
  

    

      
Event 1
      
TBA
      
2
      
Oisterwijk
      
Netherlands
      
Hardstyle
    
    

      
Event 2
      
11 October t/m 13 October
      
3
      
Volkel
      
Netherlands
      
Pop, Rock, Urban, Electronic
    
    

      
Event 3
      
TBA
      
1
      
Amsterdam
      
Netherlands
      
Electronic
    
    

      
Event 4
      
TBA
      
1
      
Utrecht
      
Netherlands
      
Electronic, Urban
    
    

      
Event 5
      
6 July - 7 July
      
2
      
Beek en Donk
      
Netherlands
      
Electronic, Hardstyle
    
​

Javascript (I removed the data parser code and default filter widget options to avoid confusion)

$("#festivaloverzichttable").tablesorter({
    sortList: [[0, 0]],
    widgets: ['zebra', 'filter', 'saveSort'],
    widgetOptions: {
        filter_reset: 'button.reset'
    }
});

$('button.search').click(function() {
    var filters = $('table').find('input.tablesorter-filter'),
        col = $(this).data('filter-column'),
        txt = $(this).data('filter-text');
    filters.eq(col).val(txt).trigger('search', false);
});

---

Update: To allow for multiple options, change the button search to the following (updated demo)

$('button.search').click(function() {
    var filters = $('table').find('input.tablesorter-filter'),
        col = $(this).data('filter-column'),
        txt = $(this).data('filter-text'),
        cur = filters.eq(col).val(),
        mult, i;

    if (cur && txt !== '') {
        mult = cur.split('|');
        i = $.inArray(txt, mult);
        if (i < 0) {
            mult.push(txt);
        } else {
            mult.splice(i,1);
        }
        txt = mult.join('|');
    }        
    filters.eq(col).val(txt).trigger('search', false);
});