Don't show foot

bucanero

Hi, I need to put totals amounts at column foot. DataTable configuration:

{
                retrieve: true,
                stateSave: true,
                bAutoWidth: false,
                stateDuration: -1,
                aoColumnDefs: 
                [
                    { bSearchable: false, aTargets: 0 },
                    { bSortable: false, aTargets: 0 },
                    { sType: "date-eu", aTargets: [1,2] },
                    { sType: "sp-string", aTargets: [3,4,5,6,7,8] },
                    { render: $.fn.dataTable.render.number( '.', ',', 2, '', '€'), aTargets: 9 },
                ],

footerCallback: function (row, data, start, end, display) 
              {
                    var columna = 9;
                    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 === 'num' ?
                                i : 0;
                    };

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

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

alert(total + "-" + pageTotal);

                    // Update footer
                    $(api.column(columna).footer()).html( pageTotal + '  (Total: 'total +'€)' );
                }
}

Alert function displays correct 'total' and 'pageTotal' values, so $(api.column()).footer().html, no works

Thanks.

bucanero

Hi, I've tested it with this:

drawCallback: function() 
                {
                   var api = this.api();
                   var columna = 9;

                   // Total over all pages
                   var total = api.column(columna).data().sum();
alert(total);

                   // Total over this page
                   var pageTotal = api.column(columna, {page:'current'}).data().sum();

alert(pageTotal);
                   $(api.column(columna+1).footer()).html('$' + pageTotal + ' ( $' + total + ' total)');
                },


jQuery.fn.dataTable.Api.register( 'sum()', function ( ) {
    return this.flatten().reduce( function ( a, b ) {
        if ( typeof a === 'string' ) {
            a = a.replace(/[^\d.-]/g, '') * 1;
        }
        if ( typeof b === 'string' ) {
            b = b.replace(/[^\d.-]/g, '') * 1;
        }
 
        return a + b;
    }, 0 );
} );

And it doesn't work either.

Thanks.

allan

Thanks for your question - however, per the forum rules can you link to a test case showing the issue please. This will allow the issue to be debugged.

Information on how to create a test page, if you can't provide a link to your own page can be found here.

Thanks,
Allan

bucanero

I forgot create it at HTML file. (<tfoot>...</tfoot>)

I turned red with shame and apologize for my cluelessness. ;-))

Thanks for all.

allan

No worries :-). Thanks for posting back!

Allan