数据表过滤器下拉不显示

时间:2021-02-05 02:50:02

标签: jquery datatables

我正在尝试通过下拉列表实现列过滤,我已经尝试了不同的方法,但对我不起作用。所以我回到了使用 initComplete 的基本实现。

    data = submission.responseJSON.transactions
    console.log(data)
    var tableCustomElements = $('#table-select');
    if (tableCustomElements.length) {
        var table = tableCustomElements.DataTable({
            'data': data,
            "columns": [{"title": "Date"},
                {"title": "Logs"},
                {"title": "Account"},
            'language': {
                'search': '',
                'searchPlaceholder': 'Search'
            },
            'order': [2, 'asc'],
            'dom': 'ft<"footer-wrapper"l<"paging-info"ip>>',
            'scrollCollapse': true,
            'pagingType': 'full',
            '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>')
                    });

                });

            }
        });

        $("th.sorting, th.sorting_asc, th.sorting_desc").css({
            'background-image': 'none',
            'cursor': 'default'
        });

        $('#table-select_wrapper').on('change', 'input[type=checkbox]', function (e) {
            var parentTR = $(this).parentsUntil('table').closest('tr');
            parentTR.toggleClass('selected', this.checked);
        });


        $('#table-select_wrapper').find('.select-all').on('click', function () {
            // Check/uncheck all checkboxes in the table
            var rows = table.rows({'search': 'applied'}).nodes();
            $('input[type="checkbox"]', rows)
                .prop('checked', this.checked)
            $(rows).toggleClass('selected', this.checked);
        });


    }

我尝试过的事情:

https://www.datatables.net/release-datatables/examples/api/multi_filter_select.html http://live.datatables.net/tamixov/1/edit

但我无法显示它,在日志中我没有收到任何错误,当我尝试使用数据表调试器时,它没有发现任何错误。

当然我已经按照指示放入了所需的jquery库,但它仍然不会显示。

您以前遇到过这个问题吗?您尝试过其他任何过滤方法吗?我希望能够通过帐户进行过滤。

0 个答案:

没有答案