Question

我已经在我的网站上使用了jQuery实时过滤器 http://chris-spittles.co.uk/jquery-filter-table/

这非常好用。我的客户后来要求我有三个可以过滤数据的输入。他们将共同努力过滤表格。

我在这里设置了一个小提琴： http://jsfiddle.net/NVL5h/5/

我想要的结果是在过滤器1中我可以输入书籍，在过滤器2中我可以输入日期。现在，该表仅显示其中包含type OR date且与过滤器输入匹配的结果。同样，我想在过滤器3中键入一个书名，现在我可以搜索具有

的表结果

'键入或日期或日期名称'

这可能与我拥有的脚本有关，或者是否有其他脚本已满足此要求？我确信它是，只是不确定如何。我确实试了一下，但没有成功。小提琴按照设计工作，我刚刚添加了我想要过滤的附加输入字段。

Answer 1

您可能想尝试使用datatables jquery插件。它应该做任何你正在寻找的表管理

https://datatables.net/

我拿了你的fiddler示例，并使用正在使用的datatable.js文件进行了一些更改，以进行多列过滤。

http://jsfiddle.net/M2mUF/

$(document).ready(function () {
    var oTable = $('.liveFilterList').dataTable({
        "oLanguage": {
            "sSearch": "Search all columns:"
        }
    });

    $("tfoot input").keyup(function () {
        /* Filter on the column (the index) of this element */
        oTable.fnFilter(this.value, $("tfoot input").index(this));
    });

   /*
    * Support functions to provide a little bit of 'user friendlyness' to the textboxes in 
    * the footer
    */
   $("tfoot input").each(function (i) {
       asInitVals[i] = this.value;
   });

   $("tfoot input").focus(function () {
       if (this.className == "search_init") {
           this.className = "";
           this.value = "";
       }
   });

   $("tfoot input").blur(function (i) {
       if (this.value == "") {
           this.className = "search_init";
           this.value = asInitVals[$("tfoot input").index(this)];
       }
   });
});

希望这有帮助

jQuery实时过滤器在具有多个输入字段/搜索条件的表上？

1 个答案: