Question

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

我正在初始化DataTables，并将分隔符设置为pipe | （正则表达式OR）但它仍然在输入的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进行过滤，主要是在使用两个单词标签或带有“保护，安全......”等逗号的标签时 - 我想我可以绕过' separator'选项无法正常工作，可以使用输入值上的替换来将逗号转换为管道，虽然这并不理想，因为某些标签有逗号，我还需要用正则表达式替换空格和逗号+空格以使其工作。

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

我看到它的方式，我有两个选择：

是否有人知道正确设置此方法以将select2中的标签用作数据表中的OR过滤器
我是regex的新手 - 有没有办法将Select2输入的标签作为标签的输入值转换为正确的正则表达式OR搜索，包括带空格/逗号的标签？

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

感谢。

Answer 1

到目前为止，我已经找到了一种方法来处理我测试过的所有用例。

我基本上绕过了Select2传递给隐藏输入字段的值，因为它弄乱了逗号，因为'separator'选项实际上没有更改tags-mode的分隔符（它只适用于多选输入）。

这是过滤功能：

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
    );              
}

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

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

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

我已更新CodePen，因此您可以看到如何使用Select2和DataTables http://codepen.io/tsdexter/pen/GcnxA

创建多标记OR可过滤表格

如何将Select2标记与DataTables正则表达式过滤相结合？

1 个答案: