0

我正在尝试使用正则表达式过滤器过滤带有通过 Select2 标记界面输入的关键字/标签的 jquery DataTables 表，以便我可以过滤 OR 而不是完全匹配。

我正在初始化 DataTables，分隔符设置为 pipe | （正则表达式或），但它仍然在输入的 value 属性中用逗号分隔标签。

jQuery('#programs-table').dataTable({
            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
            "bPaginate": false,
            "separator": "|"
          });
jQuery("#program-filter-keyword").change( fnFilterGlobal );

即使我手动更改搜索字段，它也不总是使用 OR 进行过滤，主要是在使用两个单词标签或带有逗号的标签时，如“保护、安全......” - 我想我可以绕过“分隔符”选项通过在输入值上使用替换将逗号转换为管道，虽然这并不理想，因为某些标签有逗号，我还需要用它们的正则表达式替换空格和逗号+空格才能使其工作。

function fnFilterGlobal () {
          jQuery('#programs-table').dataTable().fnFilter(
            jQuery("#program-filter-keyword").val().replace(',','|'),
            null,
            true,
            true
          );              
        }

在我看来，我有两个选择：

  1. 有谁知道将其设置为使用 select2 中的标签作为数据表上的 OR 过滤器的正确方法

  2. 我是正则表达式的新手 - 有没有办法将 Select2 作为标签的输入值输入的内容转换为正确的正则表达式或搜索，包括带有空格/逗号的标签？

这是一个示例的 CodePen（jsFiddle 已关闭）。http://codepen.io/tsdexter/pen/GcnxA

谢谢。

4

1 回答 1

0

我已经找到了一种方法来做到这一点，到目前为止，它适用于我测试过的所有用例。

我基本上绕过了 Select2 传递给隐藏输入字段的值，因为它弄乱了逗号，因为“分隔符”选项实际上并未更改标签模式的分隔符（它仅适用于多选输入）。

这是过滤功能：

function fnFilterGlobal () {             
    var tags = [];
    jQuery("#s2id_program-filter-keyword .select2-search-choice div").each(function() { 
        tags.push(jQuery(this).text()); 
    });              
    jQuery('#programs-table').dataTable().fnFilter(
        tags.join("|").replace(/ /g,"\\ "), null, true, false
    );              
}

我通过解析<ul>Select2 创建的列表并从<div>内容中提取标签值来构建所选标签的数组。

然后对于实际的过滤器字符串，我将数组项与管道符号连接起来以实现 OR 功能，并将所有空格替换为\（转义空格）。

最后，我将“智能过滤器”选项设置为false- 这是关键，否则它会尝试将过滤器字符串转换为一个复杂的正则表达式，我已经将它变成一个并且转义的空格会导致无效的正则表达式错误。

我已经更新了 CodePen，因此您可以看到如何使用 Select2 和 DataTables http://codepen.io/tsdexter/pen/GcnxA拥有多标签或可过滤表

于 2013-07-05T18:32:44.243 回答