从数据表SearchPanes中剥离超文本标记语言

Question

我正在尝试在DataTables中使用SearchPanes。但是，如下图所示，筛选器列中存在不需要的html元素。如何从SearchPanes中剥离这些html元素。我的JS代码如下：

    <script type="text/javascript">
        $(document).ready(function() {
            var table = $('.table').DataTable({
                dom: 'Bfrtip',
                buttons: [
                        {
                            extend:    'searchPanes',
                            text:      '<i class="fa fa-files-o"></i>',
                            titleAttr: 'Advanced Filters'
                        }],
                
            });
        });
    
    </script>

​

​

Answer 1

问题所在

我无法重现你所面临的具体问题。但是，我也无法在搜索窗格中正确显示超链接文本。

这似乎是由于SearchPanes插件的工作方式造成的(我称其为bug)。我对此没有一个好的解决方案。我尝试在column a渲染器中使用orthogonal data，但也没有给出正确的显示。

我的变通方法

因此，我的建议是使用一个简单的解决方法：

1. 对于"Supervisor“列，创建一个仅包含文本而不包含超链接的新隐藏列(visible: false)：例如：

A S Ansari

1. 保持现有的“学院”列不变。例如：

<a href="index.php?f=Supervisor&amp;q=A S Ansari">A S Ansari</a>

1. 在searchPanes选项中，使用隐藏列而不是可见列。

1. 对包含链接文本的所有其他列重复上述步骤。

这样，您的用户将在表中看到带有超链接的名称，并且他们将在搜索窗格中看到纯文本名称。

筛选将照常工作，但您将根据隐藏列中的数据进行筛选。

在我的测试示例中，我将名称显示为链接：

​

​

但该窗格使用隐藏列中的纯文本数据：

​

​