javascript 数据表单个列过滤（选择标签）：使用完全匹配
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12561323/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Datatables Individual Column Filtering (Select Tag) : Use Exact Match
提问by asprin
I'm using datatables 1.9.4 and the column filtering plugin. It works like a charm except that when I use 'select' tags for column filtering, the filter is not done for exact matches. It's using wildcard search, which I do not want. I thought using a select element instead of text input would solve the problem but it doesn't.
我正在使用数据表 1.9.4 和列过滤插件。它就像一个魅力，除了当我使用“选择”标签进行列过滤时，过滤器不会完全匹配。它使用通配符搜索，这是我不想要的。我认为使用选择元素而不是文本输入可以解决问题，但事实并非如此。
When i search for 'Semester - I', it should show only 'Semester - I' results. But it shows 'Semester - II'and 'Semester - III'matches too since the filter is not looking for exact match.
当我搜索'Semester - I' 时，它应该只显示 'Semester - I' 结果。但它也显示“Semester - II”和“Semester - III”匹配，因为过滤器没有寻找完全匹配。
I tried jQuery DataTable ColumnFilter plugin. Can the "select" filter style support exact match?that and also http://code.google.com/p/jquery-datatables-column-filter/issues/detail?id=11that. But none solved my problem.
我试过jQuery DataTable ColumnFilter 插件。“选择”过滤器样式是否支持精确匹配？还有http://code.google.com/p/jquery-datatables-column-filter/issues/detail?id=11那个。但没有人解决我的问题。
JS CODE
代码
$('#semester').dataTable({
"sPaginationType": "full_numbers"
})
.columnFilter({
aoColumns: [ { type: "text"},
{ type: "text" },
{ type: "select", values: [ 'Year - I', 'Year - II', 'Year - III', 'Semester - I', 'Semester - II', 'Semester - III', 'Semester - IV', 'Semester - V', 'Semester - VI', 'Semester - VII ( Integrated )', 'Semester - VIII ( Integrated )', 'Semester - IX ( Integrated )', 'Semester - X ( Integrated )']},
{ type: "text" },
null
]
});
Are there any other alternatives? Thanks in advance
还有其他选择吗？提前致谢
UPDATE
更新
I also tried the below, but that didn't help too:
我也尝试了以下方法，但这也无济于事：
if (bRegex)
oTable.fnFilter($(this).val(), iColumn, bRegex);
else
oTable.fnFilter(unescape("^"+$(this).val()+"$"), iColumn, true);
回答by asprin
Voila! Figured it out myself through a series of trial and error attempts. For those who are in a similar problem here is the solution:
瞧！通过一系列的反复试验，我自己弄明白了。对于那些遇到类似问题的人，这里是解决方案：
In the plugin file, inside select.change(function () {}), change this:
在插件文件里面select.change(function () {})，修改这个：
if (bRegex)
oTable.fnFilter($(this).val(), iColumn, bRegex);
else
oTable.fnFilter(unescape($(this).val()), iColumn);
to
到
if (bRegex)
oTable.fnFilter($(this).val(), iColumn, bRegex);
else
oTable.fnFilter(unescape("^"+$(this).val()+"$"), iColumn, true, false);
回答by Sender
multy filter in DataTable Demo
var asInitVals = new Array();
$(document).ready(function() {
var oTable = $('#example').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)];
}
} );
} );
Notethat in the above code, the support functions are provided to ensure that the end user knows what data is being filtered upon. fnFilter() is the function of primary import here.
请注意，在上述代码中，提供了支持功能以确保最终用户知道正在过滤哪些数据。fnFilter() 是这里主要导入的函数。
// after creating the table and getting the table object...
var oTable = $('#some_id').dataTable();
// ...you can use it to get a settings object...
var oSettings = oTable.fnSettings();
// ...then you can do things with the settings object
oSettings.aoPreSearchCols[ iCol ].sSearch = "^\s*"+'1'+"\s*$";
oSettings.aoPreSearchCols[ iCol ].bRegex = false;
oSettings.aoPreSearchCols[ iCol ].bSmart= false;
回答by Rochelle C
I used the accepted answer, however if I change the dropdown, then change it back to the default value I would get no results. My guess is it is trying to do an exact text search on "" and finding nothing. I made this modification and it appears to be working for me.
我使用了接受的答案，但是如果我更改下拉列表，然后将其更改回默认值，我将不会得到任何结果。我的猜测是它试图对 "" 进行精确的文本搜索，却一无所获。我做了这个修改，它似乎对我有用。
if ($(this).val() == "")
oTable.fnFilter(unescape($(this).val()), iColumn, false, false, false, false);
else {
if (bRegex)
oTable.fnFilter($(this).val(), iColumn, bRegex, false, false, false);
else
oTable.fnFilter(unescape("^" + $(this).val() + "$"), iColumn, true, false, false, false);
}
