表排序器:不将特定列值显示为筛选器

  • 本文关键字:显示 筛选 排序 tablesorter
  • 更新时间 :
  • 英文 :


是否有一种方法可以将列值作为具有"滤波器选择"属性的列上的过滤器删除。

这是@mottie in jsfiddle中的一个示例http://jsfiddle.net/mottie/856bzzel/1085/。我刚刚在 Animal 列上添加了一个"过滤器选择"。例如,是否可以从下拉滤波器值中删除 koala

html

<table class="tablesorter">
<thead>
    <tr>
        <th>AlphaNumeric</th>
        <th>Numeric</th>
        <th class="filter-match filter-select">Animals</th>
        <th>Sites</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>abc 123</td>
        <td>10</td>
        <td>Koala</td>
        <td>http://www.google.com</td>
    </tr>
    <tr>
        <td>abc 1</td>
        <td>234</td>
        <td>Ox</td>
        <td>http://www.yahoo.com</td>
    </tr>
    <tr>
        <td>abc 9</td>
        <td>10</td>
        <td>Girafee</td>
        <td>http://www.facebook.com</td>
    </tr>
    <tr>
        <td>zyx 24</td>
        <td>767</td>
        <td>Bison</td>
        <td>http://www.whitehouse.gov/</td>
    </tr>
    <tr>
        <td>abc 11</td>
        <td>3</td>
        <td>Chimp</td>
        <td>http://www.ucla.edu/</td>
    </tr>
</tbody>

脚本:Tablesorter

    /* Documentation for this tablesorter FORK can be found at
* http://mottie.github.io/tablesorter/docs/
*/
// See http://stackoverflow.com/q/40899404/145346
$(function(){
    $('table').tablesorter({
        theme: 'blue',
        widgets: ['zebra', 'filter'],
        widgetOptions: {
            filter_defaultFilter: {
        // Ox will always show
        2: '{q}|Ox'
      }
        }
    });
});

在这种情况下,您需要filter_selectSource选项来操纵Select(Demo)

的选项
$(function() {
  $('table').tablesorter({
    theme: 'blue',
    widgets: ['zebra', 'filter'],
    widgetOptions: {
      filter_defaultFilter: {
        // Ox will always show
        2: '{q}|Ox'
      },
      filter_selectSource: function(table, column, onlyAvail) {
        // get an array of all table cell contents for a table column
        var array = $.tablesorter.filter.getOptions(table, column, onlyAvail);
        // remove Koala (multiple entries) from array
        return $.grep(array, function(animal) {
          return animal !== "Koala";
        });
      }
    }
  });
});

最新更新