Question

我正在创建的数据表有一个“性别”列。这是过滤器..

columnFilter({
    aoColumns: [ { type: "select", values: [ 'Male', 'Female' ]  },
                 { type: "text" },  
                 { type: "number" },    
                 { type: "number" }]
});

问题是“男性”这个词出现在“女性”这个词中，所以当我选择“男性”过滤器时，它会显示全部。有没有办法让这个选择完全匹配，甚至至少区分大小写？

Answer 1

Columnfilter插件使用数据表API函数fnFilter进行单独搜索。根据作者的文档（很少）他似乎忘记了fnFilter function中的区分大小写的参数（搜索fnFilter），并且插件没有为过滤器设置留下太多余地。

有一些替代方案。

您可以使用fnFilter功能设计自己的过滤插件，现在您知道它已存在。

您可以执行一些临时解决方案like in this example。请注意，这是一个非常懒惰的示例，但它显示了插件基本上如何工作。

如果你想要它，你可以改变插件代码中的过滤。这是我推荐的，因为它很容易解决。在datatables.columnFilter.js中添加/更改这些行应该足够了

//Line 563
...
var defaults = {
    sPlaceHolder: "foot",
    sRangeSeparator: "~",
    iFilteringDelay: 500,
    aoColumns: null,
    sRangeFormat: "From {from} to {to}",
    bCaseSensitive: true //add this
};

properties = $.extend(defaults, options);

//Line 357
...
function fnCreateSelect(oTable, aData, bRegex, bCaseSensitive) { //add parameter
    var oSettings = oTable.fnSettings();
    if (aData == null && oSettings.sAjaxSource != "" && !oSettings.oFeatures.bServerSide) {
        oSettings.aoDrawCallback.push({
            "fn": (function (iColumn, nTh, sLabel) {
                return function () {
                    if (oSettings.iDraw == 2 && oSettings.sAjaxSource != null && oSettings.sAjaxSource != "" && !oSettings.oFeatures.bServerSide) {
                        //add parameter
                        return fnCreateColumnSelect(oTable, null, _fnColumnIndex(iColumn), nTh, sLabel, bRegex, true, true, !bCaseSensitive);
                    }
                };
            })(i, th, label),
            "sName": "column_filter_" + i
        });
    }
    //add parameter
    fnCreateColumnSelect(oTable, aData, _fnColumnIndex(i), th, label, bRegex, true, true, !bCaseSensitive);
}

//Line 311
...
function fnCreateColumnSelect(oTable, aData, iColumn, nTh, sLabel, bRegex, bCaseSensitive) { //add this

    //...

    select.change(function () {

        //...

        if (bRegex)
            //add parameter
            oTable.fnFilter($(this).val(), iColumn, bRegex, true, true, !bCaseSensitive);
        else
            //add parameter
            oTable.fnFilter(unescape($(this).val()), iColumn, false, true, true, !bCaseSensitive);
        fnOnFiltered();
    });
}

那些.fnFilter应该足以得到你想要的东西。还有更多，所以如果你想将它添加到其他人身上，那就做同样的事情。

我所做的只是添加一个名为bCaseSensitive的默认参数，您现在可以在选项中输入，然后将相同的参数添加到创建事件的函数中，当然，将其添加到{{1}功能本身。

祝你好运！

如果你无法让它工作，我会看看我是否可以上传改变后的插件供你下载。

jQuery DataTable ColumnFilter插件。 “选择”过滤器样式是否支持完全匹配？

1 个答案: