DataTable - 为什么我不能让单个列搜索（选择输入）工作？答案

【问题标题】：DataTable - Why can't I get individual column searching (select inputs) working?DataTable - 为什么我不能让单个列搜索（选择输入）工作？
【发布时间】：2016-08-08 17:43:23
【问题描述】：

我正在使用来自DataTables.net 的 JavaScript 表格好东西包，我遇到了一个非常适合我需要的功能，即单个列搜索（选择输入）found here。

此功能允许向下钻取列数据，对其进行过滤。

我尝试了标准实现，但没有成功。我在实现中找不到特定字段，并尝试删除所有其他属性。

我的代码是：

<script type="text/javascript">
    $(document).ready(function() {
        $('#alertLogTable').DataTable( {
            language: {
                url: '//cdn.datatables.net/plug-ins/1.10.11/i18n/Portuguese-Brasil.json'
            },
            responsive: true,
            initComplete: function () {
                this.api().columns().every( function () {
                    var column = this;
                    var select = $('<select><option value=""></option></select>')
                        .appendTo( $(column.footer()).empty() )
                        .on( 'change', function () {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );

                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } );

                column.data().unique().sort().each( function ( d, j ) {
                   select.append( '<option value="'+d+'">'+d+'</option>' )
                } );
                } );
            }
        });
    });
</script>

datatables.net 页面上的演示在每列下方显示了用于过滤它的按钮。我不明白那些和过滤功能。我在这里错过了什么？

【问题讨论】：

什么不起作用？
@CMedina，我可能让我自己不清楚什么不起作用。道歉。我将编辑问题，但页面上的演示会在每列下方显示用于过滤问题的按钮。
您在控制台中看到了什么？搜索词有任何错误信息吗？
Firebug 控制台没有显示任何问题或错误，所有其他 dataTable 功能都运行良好。

标签： javascript jquery datatable datatables

【解决方案1】：

您的代码works fine。我 100% 确定您只是忘记包含 <tfoot> 部分。页脚不是魔法添加的，如果<tfoot> 不存在，您的<select> 将被插入到任何内容中。所以记住：

<table>
  <thead>
    <tr><th></th></tr>
  </thead>
  <tbody>
    <tr><td></td></tr>
  </tbody>
  <tfoot>
    <tr><th></th></tr>
  </tfoot>
</table>

【讨论】：