JQuery之DataTables 的 累计

Question

可以看到 这里价格

想到 在底部 可以 有累计这一行的价格总和的 价格 是搜索结果后的价格总和

有大神指导一下吗

Answer 1

使用footerCallback回调函数可以满足你的要求

$(document).ready(function() {
    $('#example').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);
                } );

            // 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(
                '
参考这个例子

表格foot回调 高级初始化 示例 Datatables中文网:http://dt.thxopen.com/example/advanced_init/footer_callback.html
+pageTotal +' ( 
参考这个例子

表格foot回调 高级初始化 示例 Datatables中文网:http://dt.thxopen.com/example/advanced_init/footer_callback.html
+ total +' total)'
            );
        }
    } );
} );

参考这个例子
表格foot回调 高级初始化 示例 Datatables中文网:http://dt.thxopen.com/example/advanced_init/footer_callback.html