DataTables 不区分大小写的搜索问题
DataTables Case Insensitive Search Issue
我正在使用 DataTables 和 jQuery 创建一组复选框以使用搜索框过滤 table。这已在 http://www.lynden.com/about/brochures-test.html 上完全实现。基本上,当您 select 带有复选框的选项时,它会将该选项作为字符串并将其插入到 DataTables 搜索框中。它工作得很好,除了 caseInsensitive 功能在没有任何事先过滤的情况下将输入输入到搜索框中时直接不起作用,这很奇怪。更奇怪的是,当使用 "mi" 搜索时,它会拉出三个包含 Dynamic 一词的结果,但会完全忽略 Milky Way 公司类别。有谁知道为什么它可以不区分大小写地搜索但忽略大写单词的开头?
$('.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();
}
我希望在这个问题上得到一些帮助!
您使用的 search()
API 方法不正确。显然,您最初对 search()
的错误调用导致 table 的行为与配置的不同。
您应该如下所示调用它:
table.search(pID).draw();
和
table.search(filters).draw();
可以省略 search()
的其他参数,因为它们启用 "smart" 和不区分大小写的搜索。
有关代码和演示,请参阅 this example。
我正在使用 DataTables 和 jQuery 创建一组复选框以使用搜索框过滤 table。这已在 http://www.lynden.com/about/brochures-test.html 上完全实现。基本上,当您 select 带有复选框的选项时,它会将该选项作为字符串并将其插入到 DataTables 搜索框中。它工作得很好,除了 caseInsensitive 功能在没有任何事先过滤的情况下将输入输入到搜索框中时直接不起作用,这很奇怪。更奇怪的是,当使用 "mi" 搜索时,它会拉出三个包含 Dynamic 一词的结果,但会完全忽略 Milky Way 公司类别。有谁知道为什么它可以不区分大小写地搜索但忽略大写单词的开头?
$('.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();
}
我希望在这个问题上得到一些帮助!
您使用的 search()
API 方法不正确。显然,您最初对 search()
的错误调用导致 table 的行为与配置的不同。
您应该如下所示调用它:
table.search(pID).draw();
和
table.search(filters).draw();
可以省略 search()
的其他参数,因为它们启用 "smart" 和不区分大小写的搜索。
有关代码和演示,请参阅 this example。