Question

我有以下两个引导程序表过滤器设置，它们都可以单独完美地工作。但是我遇到了问题＆＃34; merge＆＃34;他们一起玩得很好：

  $("#filter").keyup ->
    rex = new RegExp($(this).val(), "i")
    $(".searchable tr").hide()
    $(".searchable tr").filter(->
        rex.test $(this).text()
      else
        rex.test $(this).text()
    ).show()
    $(".no-data").hide()
    $(".no-data").show()  if $(".searchable tr:visible").length is 0
    return

和

  $("#filterCheckBox").on "change", ->
    if @checked
      $(".searchable tr").hide()
      $(".searchable tr").filter(->
        $(this).find("td").eq(3).text() isnt 0
      ).show()
      $(".no-data").hide()
      $(".no-data").show()  if $(".searchable tr:visible").length is 0
    else
      $(".searchable tr").show()
      $(".no-data").hide()
    return

我的问题是一个过滤器总是覆盖另一个过滤器。我已经尝试了很多合并它们但没有运气或成功。

filterCheckBox应该更强大＆＃34;比第一个过滤器。

编辑：这是一个jsfiddle：http://jsfiddle.net/mtz1etfz/

Answer 1

好的 - 我修改了你的小提琴。

我添加了两个新功能：

function checkZero(currentTr){

            if(  $('#filter2').is(':checked'))
            {
               return ($(currentTr).find('td').eq(3).text() !== "0");     
            }else
            {
                return true;
            }
  }

  function matchesSearch(currentTr) {

              var rex = new RegExp($("#filter").val(), 'i');
              return rex.test($(currentTr).text());
  }

它们基本上封装了您在更改处理程序中执行的检查。然后我还修改了你的改变处理程序 - 调用BOTH函数。您想同时应用两个“过滤器”，因此您必须同时检查两者：

$('.searchable tr').filter(function () {
               return matchesSearch(this) && checkZero(this);
            }).show();

http://jsfiddle.net/mtz1etfz/1/

带有复选框和搜索框的引导程序表过滤器 - javascript

1 个答案: