在DataTables的单个下拉列表中进行多列筛选

Question

我正在使用DataTables，这是jQuery Javascript库的插件。已经有搜索和过滤的可能性，但我找不到，我正在寻找。

我已经在网上搜索过，但我还没有找到问题的解决方案。也许我搜索了错误的条款，所以如果我的问题的解决方案可能非常简单，我很抱歉。

示例表：

所以，我想做的是以下内容：

• 提供一个带有多个过滤器选项的单个下拉列表
• 每个选项都会提供自定义过滤条件（例如＆＃39; option1＆＃39;显示全部 可用的记录，＆＃39; option2＆＃39;显示所有记录 可用，并有标签F，＆＃39; option3＆＃39;显示所有记录 可用，并有标签E，...）
• 立即应用过滤器＆＃39; live＆＃39;

摘要：我想创建一个下拉列表，提供进行多列过滤/搜索的选项。

那么，我怎样才能做到这一点？这在DataTables中是否可行？

提前致谢。

Answer 1

这个JS：

$(document).ready(function() {
    var table = $('#example').DataTable();
    $('select[name="filter"]').change(function() {
        if (!$(this).val()) {
            table.columns().search("").draw();
        } else {
            table.columns().search("");
            var option = $(this).find(":selected");
            var columns = Object.keys(option.data());
            console.log(columns)
            $.each(columns, function(k, v){
                table.columns(parseInt(v, 10)).search(option.data(v));
            });
            table.draw();
        }
    });
});

使用此HTML：

<select name="filter">
    <option value="">No filter</option>
    <option data-1="Accountant">Filter Accountant</option>
    <option data-2="Tokyo">Filter Tokyo</option>
    <option data-1="Accountant" data-2="Tokyo">Filter Accountant in Tokyo</option>
</select>

应该做你需要的。我们迭代所选选项的数据属性并搜索相关列。工作JSFiddle here。

希望有所帮助。