Фильтр столбца не работает с группировкой строк

голоса
8

Когда я интегрировать JQuery DataTables фильтр столбцов и строк группировку , JQuery DataTables колонка фильтр не работает.

Я попробовал демо , но это , кажется , в фильтре демо колонке также не работает.

Задан 24/09/2015 в 04:40
пользователем
На других языках...                            


1 ответов

голоса
1

РЕШЕНИЕ

Не подключаемые модули Роу Группировка вместе с Column фильтрации больше не разрабатывается, я бы не рекомендовал использовать их. Используйте DataTables варианту и методу API для выполнения ряда группировки и индивидуальный поиска столбца , как показано на Роу группирование примера и индивидуальный примера столбца поиска .

// Setup - add a text input to each footer cell
$('#example tfoot th').each( function () {
    var title = $('#example thead th').eq( $(this).index() ).text();
    $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
} );

// DataTable
var table = $('#example').DataTable({
    "order": [[2, 'asc']],
    "drawCallback": function (settings){
        var api = this.api();

        // Zero-based index of the column for row grouping
        var col_name = 2;

        // If ordered by column containing names
        if (api.order()[0][0] === col_name) {
            var rows = api.rows({ page: 'current' }).nodes();
            var group_last = null;

            api.column(col_name, { page: 'current' }).data().each(function (name, index){
                var group = name;

                if (group_last !== group) {
                    $(rows).eq(index).before(
                        '<tr class="group"><td colspan="6">' + group + '</td></tr>'
                    );

                    group_last = group;
                }
            });
        }
    }
});

// Apply the search
table.columns().every( function () {
    var that = this;

    $( 'input', this.footer() ).on( 'keyup change', function () {
        if ( that.search() !== this.value ) {
            that
                .search( this.value )
                .draw();
        }
    } );
} );    

DEMO

Смотрите этот jsFiddle для кода и демонстрации.

Ответил 24/09/2015 в 12:14
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more