如何使用jQuery DataTables插件过滤带有特殊字符的结果？

Question

如何使用jQuery DataTables插件过滤带有特殊字符的结果？

phpjqueryspecial-charactersdatatableshtml-entities

16

我在我的应用程序中使用了 jQuery DataTables 插件，其中许多表行和过滤器都包含特殊字符，尤其是 &。当我尝试在这些列上进行筛选时，所有记录都会消失，并显示“未找到匹配的记录”。

我已经尝试对字符串进行编码（即htmlspecialchars）和解码（即htmlspecialchars_decode），但似乎都不起作用。

示例：http://jsfiddle.net/gkdcZ/3/

有什么想法为什么会发生这种情况，以及我该如何解决？

HTML：

<select id="filter_col_1" name="filter_col_1">
    <option value="">Select</option>
    <option value="A&B">A&B</option>
    <option value="C">C</option>
    <option value="D">D</option>   
</select>

<tr>
    <td>A&B</td>
    <td>Jones, Brandon</td>
    <td>01/02/2003</td>
</tr>

JavaScript:

$("#filter_col_1").change( function() { 
    $('#results').dataTable().fnFilter(
        '\\b' + $("#filter_col_1").val() + '\\b',
        1,
        true,
        false
    );
} );

更新 #1： 问题似乎只在限制列数时发生。请参见DataTables API。当参数设置为“null”时，正常工作。http://jsfiddle.net/gkdcZ/4/

更新 #2： 有所进展。添加一个替换HTML实体的函数可以处理某些字符（如“&”），但无法处理其他字符（如感叹号和问号）。请参见http://jsfiddle.net/cz6Bs/4/

'\\b' + htmlEntities($('#filter_col_1').val()) + '\\b'

function htmlEntities(str) {
return String(str).replace(/&/g, '&amp;')
                  .replace(/</g, '&lt;')
                  .replace(/>/g,     '&gt;')
                  .replace(/"/g, '&quot;');
}

- Michael

你能把 '&' 替换成 'and' 吗？像这样：str_replace("&", " and ", $input); - azzy81

2

我不明白你想做什么。你能发一下你的Javascript代码吗？ - pomeh

刚刚在JavaScript中添加了代码。我正在尝试根据下拉框的选择来过滤搜索结果。我的下拉框中有一些带有特殊字符的项目，这正是导致问题的原因。 - Michael

嗨@Daniel，我也在使用FF11，它显示的是这个：http://snag.gy/iNlFh.jpg 我已经在Chrome 18和IE9中尝试过了。结果一样。 - Michael

1

$('#results').dataTable().fnFilter( $("#filter_col_1").val(),

        null,
       
        false
    );

- Daniel

显示剩余4条评论

3个回答

3

尝试这个：

$(document).ready(function() { 
$('#results').dataTable();
$("#filter_col_1").change( function() { 
    $('#results').dataTable().fnFilter(  
'\\b' + htmlEntities($('#filter_col_1').val()) + '\\b', 
 0,
true,
false
);
 } );  


});    
function htmlEntities(str) {
return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g,     '&gt;').replace(/"/g, '&quot;');
}

- sm13294

这离解决问题似乎越来越近了! :) 然而，如果在下拉列表和结果中有其他字符，如感叹号或问号，则似乎无法正常工作。请参见：http://jsfiddle.net/cz6Bs/4/ （现在查看选项 C 和 D）。 - Michael

1

试试这个

 $('#results').dataTable().fnFilter(
        $("#filter_col_1").val(),
        null,
        true
    );

将其设置为筛选所有列，现在可以正常工作...

- Daniel

为了其他原因，我肯定需要保留正则表达式，并且特定的列过滤也非常重要。 - Michael

好的，将正则表达式设置回true，可以工作...不确定为什么只有在列字段为空时才能工作... - Daniel

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- CashIsClay · Accepted Answer

确实，dataTables存在一个bug，会导致任何特殊字符出现问题，因此您需要对它们进行转义。

注意：我添加了XRegExp作为另一种转义资源。 http://xregexp.com/

示例代码：

http://jsfiddle.net/cz6Bs/