【问题标题】:Table filter not working with select2表过滤器不适用于 select2
【发布时间】:2017-11-22 23:47:47
【问题描述】:

我正在为我的项目创建表格过滤器。使用输入字段它可以完美地工作,但我无法正常工作 select2 过滤器,它只是不工作.. 这是我的 jQuery 代码:

$(document).ready(function() {
  $('.filterable .filters input, select').keyup(function(e) {
    var code = e.keyCode || e.which;
    if (code == '9') return;
    var $input = $(this),
      inputContent = $input.val().toLowerCase(),
      $panel = $input.parents('.filterable'),
      column = $panel.find('.filters th').index($input.parents('th')),
      $table = $panel.find('.table'),
      $rows = $table.find('tbody tr');

    var $filteredRows = $rows.filter(function() {
      var value = $(this).find('td').eq(column).text().toLowerCase();
      return value.indexOf(inputContent) === -1;
    });

    $table.find('tbody .no-result').remove();
    $rows.show();
    $filteredRows.hide();

    if ($filteredRows.length === $rows.length) {
      $table.find('tbody').prepend($('<tr class="no-result text-center"><td colspan="' + $table.find('.filters th').length + '">Deja, bet rezultatų nepavyko rasti</td></tr>'));
    }
  });
});

$("#street").select2({
  minimumInputLength: 3
});

这是我的 JsFiddle : https://jsfiddle.net/5202jsax/9/

提前感谢帮助!

【问题讨论】:

    标签: javascript jquery jquery-select2


    【解决方案1】:

    Working Fiddle.

    keyup 事件不适用于列表select,您只需添加change 事件也可以处理选择元素,例如:

    $('.filterable .filters input, select').on('input change', function(e) {
        //Your logic HERE
    });
    

    注意:我在此示例中使用input 事件,因为它在处理用户输入时更有效。

    希望这会有所帮助。

    【讨论】:

      猜你喜欢
      • 2011-12-17
      • 2016-04-22
      • 2022-10-13
      • 1970-01-01
      • 2011-12-08
      • 1970-01-01
      • 2014-03-11
      • 2021-07-07
      • 2017-10-06
      相关资源
      最近更新 更多