DataTables案例不敏感搜索问题

时间:2017-12-19 17:51:51

标签: jquery filter datatable datatables case-insensitive

我正在使用DataTables和jQuery创建一组复选框,以使用搜索框过滤表格。这是在http://www.lynden.com/about/brochures-test.html完全实施的。基本上,当您选中带有复选框的选项时,它会将该选项作为字符串并将其插入DataTables搜索框中。它工作得很好,除了caseInsensitive功能在没有任何先前过滤的情况下将输入输入搜索框时直接起作用,这很奇怪。 Weirder仍然是用" mi"它会在动态中提取三个结果,但完全会忽略银河公司的类别。有没有人知道为什么它可以对搜索案例不敏感但忽略大写单词的开头?

    $('.dropdown-container')
.on('click', '.dropdown-button', function () {
    $('.dropdown-list').toggle();
})
.on('input', '.dropdown-search', function () {
    var target = $(this);
    var search = target.val().toLowerCase();
console.log(search);
    if (!search) {
        $('li').show();
        return false;
    }

    $('li').each(function () {
        var text = $(this).text().toLowerCase();
        var match = text.indexOf(search) > -1;
        $(this).toggle(match);
    });
})
.on('change', '[type="checkbox"]', function () {
    var numChecked = $('[type="checkbox"]:checked').length;
    $('.quantity').text(numChecked || 'Any');
});

$(document).ready(function () {
table = $('#brochure').DataTable({
    "search": {
"caseInsensitive": true
  },
    "pageLength": 25,
    "order": [
                [2, "desc"]
            ],
    "lengthMenu": [
                [25, 50, 75, -1],
                [25, 50, 75, "All"]
            ],
    "columnDefs": [{
        "targets": [2, 4, 5],
        "visible": false
            }]
});
var pID = location.search; //grab everything after and including the "?" in the URL
console.log(pID);
mloc = pID.indexOf("=") + 1; //identify the location of the actual value
pID = pID.slice(mloc) // captures the value of the parameter
table.search(pID, [1, 2, 3, 4], true, false, false, true).draw(); // assigns the parameter to the hidden input tag's value
})

function filter() {
//build a industry string 
var filters = $('input:checkbox[name="filter"]:checked').map(function ()    {
    return this.value;
}).get().join(' ');
console.log(filters);
//now filter in column 3, with a regular expression, no smart filtering, no inputbox, not case sensitive
table.search(filters, [1, 2, 3, 4], true, false, false, true).draw();
}

我在这个问题上得到了一些帮助!

1 个答案:

答案 0 :(得分:1)

您错误地使用了search() API方法。显然,您对search()的初始错误调用会导致表的行为与配置不同。

您应该按如下所示调用它:

table.search(pID).draw();

table.search(filters).draw();

search()的其他参数可以省略,因为它们启用“智能”和不区分大小写的搜索。

请参阅this example以获取代码和演示。