Question

我需要在数据库表中添加一个下拉过滤器选项，该选项根据所选值在表中显示记录。我检查了DataTable的最新文档，并尝试了以下内容：

$('#checkin-checkout-record-table').dataTable({
   /* "dom": '<"toolbar">C<"clear">lfrtip<"clear">T',
    tableTools: {
        "sSwfPath": app.baseurl("/gbdportal/assets/js/libs/TableTools-2.2.4/swf/copy_csv_xls_pdf.swf"),
        "aButtons": [{
            "sExtends": "xls",
            "oSelectorOpts": { filter: 'applied', order: 'current'  }

        }]
    },*/
    "bPaginate": true,
    "bLengthChange": true,
    "bFilter": true,
    "bSort": true,
    "bInfo": true,
    // "order": [[0, 'asc'], [4, 'asc']],
    "aLengthMenu": [50, 100],
    "bAutoWidth": false,

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

但不会显示过滤器下拉列表。我认为这可能是由于版本不兼容。我使用的是1.10.0-dev版本。

Answer 1

您的错误在于您尝试将Datatables 1.10.0版本与legacy Databales

一起使用

这可以从您的Datatables初始化代码中看出：

$('#checkin-checkout-record-table').dataTable({....

正确使用1.10.0+将是（MIND THE CAPS）：

$('#checkin-checkout-record-table').DataTable({

您可以使用旧版dataTables或新的DataTables来执行您想要的操作，但始终使用与您的首选版本匹配的代码。

在datatable插件中添加下拉过滤器选项

1 个答案: