DataTables结合了FooterCallback并选择了过滤

时间:2015-12-09 17:08:56

标签: javascript php jquery function datatables

晚上好。

我在组合两个DataTables函数(see title)时遇到了一些问题。

(FooterCallback)显示带有数值的列的总和:

$(document).ready(function() {
$('#pr_table').DataTable( {
    "footerCallback": function ( row, data, start, end, display ) {
        var api = this.api(), data;

        // Remove the formatting to get integer data for summation
        var intVal = function ( i ) {
            return typeof i === 'string' ?
                i.replace(/[\$,]/g, '')*1 :
                typeof i === 'number' ?
                    i : 0;
        };

        // Total over all pages
        total = api
            .column( 4 )
            .data()
            .reduce( function (a, b) {
                return intVal(a) + intVal(b);
            }, 0 );

        // Total over this page
        pageTotal = api
            .column( 4, { page: 'current'} )
            .data()
            .reduce( function (a, b) {
                return intVal(a) + intVal(b);
            }, 0 );

        // Update footer
        $( api.column( 4 ).footer() ).html(
            'cub.m'+pageTotal +' ( cub.m'+ total +' total)'
        );
    }
  } );
} );

使用此(select filtering)

$(document).ready(function() {
$('#pr_table').DataTable( {
    "initComplete": function () {
        var api = this.api();

        api.columns().indexes().flatten().each( function ( i ) {
            var column = api.column( i );
            var select = $('<select><option value=""></option></select>')
                .appendTo( $(column.header()).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>' )
            } );
        } );
    }

  } );
} );

如果我只在我的脚本中使用其中一个函数,那么一切正常。但是尝试将它们组合在一起会导致DataTables无法初始化(只显示原始html表)。 我相对不熟悉这个高级的javascript,所以如果有人给我一个脚本的例子,并在一次初始化中解释如何使用多个函数,它会对我有所帮助。

0 个答案:

没有答案