TableSorter多過濾器

我有一個tablesorter表，其中包含「類別」列。我的搜索顯示了許多不同的方法來過濾各種類型的列，但它們都歸結爲一個過濾條件。TableSorter多過濾器

我所擁有的是一個頁面上列出了所有帶有複選框的類別，這個想法是允許用戶選擇他們想要查看的類別（有10個不同的類別），並且這些選擇的類別是應用於過濾tablesorter中的行。

我總是可以蠻力強制這個與回發到我的控制器並返回一個過濾的行集模型，但如果有一個明智的方式來完成這一點在客戶端，我將不勝感激任何人在哪裏輸入開始解決這樣的問題。

2013-07-26 Bitfiddler

這是我的第一個破解。因此，假設我有一堆代表要過濾的類別的複選框。類'tablesorter'就是我稱之爲包含數據的表。我向其中包含類別的單元添加了一個id屬性。我這樣做是因爲我不希望ID在屏幕上可見。最後，我隱藏/取消隱藏行後刷新斑馬條紋。如果有更好的方法來做到這一點，我全部耳朵（我是一個總的JavaScript/jquery/tablesorter新手）。

function FilterCompanies() { 
     $(':checkbox:not(:checked)').each(function() { 
      var unselectedCategoryId = $(this).attr('id').substring(3); 
      $('.tablesorter > tbody > tr > td[id]').each(function() { 
       if ($(this).attr('id') == unselectedCategoryId) { 
        $($(this).parent()).addClass('hidden'); 
       } 
      }); 
     }); 
     $(':checkbox:checked').each(function() { 
      var unselectedCategoryId = $(this).attr('id').substring(3); 
      $('.tablesorter > tbody > tr > td[id]').each(function() { 
       if ($(this).attr('id') == unselectedCategoryId) { 
        $($(this).parent()).removeClass('hidden'); 
       } 
      }); 
     }); 
     $(".tablesorter").trigger("applyWidgets") 
    }

這裏是什麼樣子：

enter image description here

來源

2013-07-26 22:56:44 Bitfiddler

TableSorter多過濾器

回答

相關問題