JSBin:http://live.datatables.net/nujehixu/3/edit?js,console,output
$(document).ready( function () {
// push our custom filter onto the stack of filters
$.fn.dataTable.ext.search.push(function(settings, searchData, index, rowData, counter) {
// get filter value
var value = $("#example_filter > label > input").val().toLowerCase();
// check filter value against original row data
var original = rowData[1].toLowerCase();
console.log(original);
return original.indexOf(value) > -1;
});
function addEllipsis(original, charLimit) {
if (original.length > charLimit) {
// substring the original and add ellipsis with a title attribute of the original
return '<div title="' + original + '">' + original.substr(0, charLimit) + '…' + '</div>';
}
// return the original value since it is already short enough
return '<div title="' + original + '">' + original + '</div>';
}
var table = $('#example').DataTable({
columnDefs: [
{
targets: 1,
render: function (data, type, row) {
// render with ellipsis if necessary
return addEllipsis(data, 6);
}
}
]
});
} );
看看链接的示例,我试图基于原始行数据使用自定义过滤器,但是当输入过滤器值(例如
systems
)时,问题就浮出水面了。当我希望systems
匹配“ Systems Administrator”并显示这些行时,将过滤掉具有Systems Administrator的行。仔细阅读source,看起来首先对搜索字符串global filter应用了compiled from the rendered values。
有没有人找到解决方案?
最佳答案
您的问题是仍然执行默认搜索,并且由于列的值呈现为“ system ...”,因此它无法找到与“ systems”的任何匹配项。您可以这样做:
$("#example_filter > label > input").unbind().bind('keyup', function() {
var value = this.value.toLowerCase();
// push our custom filter onto the stack of filters
$.fn.dataTable.ext.search.push(function(settings, searchData, index, rowData, counter) {
// get filter value
// check filter value against original row data
var original = rowData[1].toLowerCase();
console.log(original);
return original.indexOf(value) > -1;
});
table.draw();
$.fn.dataTable.ext.search.pop();
})
更改的代码-> http://live.datatables.net/dalesexe/4/edit
更好的答案是根据
render()
从type
返回不同的值,这些值可以是_
,filter
或display
。在display
上,返回省略号,否则返回原始值。这样,您可以完全跳过自定义过滤器:render: function (data, type, row) {
switch (type) {
case 'display' :
return addEllipsis(data, 6); break;
default :
return data; break;
}
}
新代码-> http://live.datatables.net/dalesexe/6/edit