Question

我正在使用jQuery DataTables plugin，并且其中的过滤功能存在轻微问题。如果我有一个包含<a href='foo6'>Blah</a>内容的表格单元格，并且我过滤为“6”，那么即使“Blah”中没有“6”，该单元格也会显示出来。我想做的是让DataTables插件在进行过滤时忽略HTML。

我已经尝试过搜索DataTables网站，发现了相互矛盾，没有帮助的潜在客户。一篇帖子建议我在aaColumns的定义中需要一个sType:'html'选项，但是我尝试了它并没有帮助...加上后来的帖子暗示当前版本的DataTables会自动检测HTML sType 。我还发现了这段代码：

// Make filtering ignore HTML (see http://datatables.net/plug-ins/filtering)
$.fn.dataTableExt.ofnSearch['html'] = function ( sData ) {
    var n = document.createElement('div');
    n.innerHTML = sData;
    if (n.textContent) {
        return n.textContent.replace(/\n/g," ");
    } else {
        return n.innerText.replace(/\n/g," ");
    }
};

本来应该解决的问题......但事实并非如此。

所以，我的问题是：有没有人知道如何在过滤行时使DataTables忽略非文本（即HTML）内容？

Answer 1

事实证明我的列标题需要自定义mRender功能。更重要的是（因为我在没有检查“type”参数的情况下首先尝试过这个），你需要使用提供给该函数的type参数使其仅在过滤时应用。

我的最终结果看起来像这样：

aaHeaders: [{
    mRender: function(data, type, full) {
        // If we're filtering, don't look at the HTML; only filter on the text
        return type == 'filter' ? $(data).text() : data
    }
}], //...

Answer 2

你可以尝试这个：

$.fn.dataTableExt.ofnSearch['html'] = function ( sData ) {
    return $("<div/>").html(sData).text();
}

Answer 3

只需升级你的datatable.js ..我已经使用过1.9.4并在升级到1.10.9之后遇到了同样的问题，问题解决了..

Answer 4

// To override basic search functionality of datatable
            $.fn.dataTable.ext.search.push(
                    function( settings, data, dataIndex ) {
                        var tableId = settings['sTableId'];
                        var searchTerm = settings.oPreviousSearch.sSearch;
                        if ( 'tableId' == tableId){
//I added tableId condition as I have multiple table on same page..
                            if(data[0].indexOf(searchTerm) > -1 ||data[2].indexOf(searchTerm) > -1||data[3].indexOf(searchTerm) > -1||data[4].indexOf(searchTerm) > -1||data[5].indexOf(searchTerm) > -1 || data[6].indexOf(searchTerm) > -1){
                                return true;
                            }else{
                                return false;
                            }
                        }
                        return true;
                    }
            );

过滤jQuery数据表时如何忽略HTML？

4 个答案: