如何使用multiselect选项和下拉菜单过滤表数据?

时间:2019-10-29 11:14:21

标签: filter datatables dropdown tablefilter jquery-ui-multiselect

如何使下拉过滤器处于多选状态?还是有其他数据表可以做到这一点?

https://codepen.io/rifat-h/pen/gOOxjvb

我在这个问题上搜索了很多。我可能不知道如何搜索此问题。我将使用其他任何可以让我拥有带有多选下拉列表的表数据过滤器的东西,例如select2或jquery-chosen。

(function ($) {

    var dataTable;

    var select2Init = function () {
        $('select').select2({
            dropdownAutoWidth: true,
            allowClear: true,
            placeholder: "Select a grade",
        });
    };

    var dataTableInit = function () {
        dataTable = $('table').dataTable({
            "columnDefs": [{
                "targets": 2,
                "type": 'num',
            }, {
                "targets": 3,
                "type": 'num',
            }],
        });
    };

    var dtSearchInit = function () {

        $('#grade').change(function () {
            dtSearchAction($(this), 2)
        });
        $('#two_grade').change(function () {
            dtSearchAction($(this), 3);
        });

    };

    dtSearchAction = function (selector, columnId) {
        var fv = selector.val();
        if ((fv == '') || (fv == null)) {
            dataTable.api().column(columnId).search('', true, false).draw();
        } else {
            dataTable.api().column(columnId).search(fv, true, false).draw();
        }
    };


    $(document).ready(function () {
        select2Init();
        dataTableInit();
        dtSearchInit();
    });

})(jQuery);

0 个答案:

没有答案