footerCallback

footerCallback

Andreas S.Andreas S. Posts: 208Questions: 74Answers: 4
edited July 2017 in DataTables 1.10

I have some Problem to add a summary to the footer at the end of the Table. I use your example. The sum of the columns work. I see the right result in the console.log(). Please help me to find the Problem why the result are not shown at the end of the Table.
footerCallback:

            footerCallback: function(tfoot, data, start, end, display){
                var api = this.api();

                $(api.column(5).footer()).html(
                    api.column(5).data().reduce(function(a,b){
                        return a + b;
                    }, 0)
                );
            }

The debugger link is debug.datatables.net/atefic

Anyone a idea what is wrong in my code?

Andreas

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,330Questions: 26Answers: 4,951
    Answer ✓

    I created a quick test case with your function. The result was all of the column values were appended into a string. I changed the return line to this:

    return parseInt(a) + parseInt(b);

    Now I get the sum of the numbers in the footer.

    You can see the test case here:
    http://live.datatables.net/fepanigo/1/edit

    If you are not seeing anything then my first thought is you didn't define a footer for your table. How is your HTML table setup?

    Kevin

  • Andreas S.Andreas S. Posts: 208Questions: 74Answers: 4
    edited July 2017

    Thanks for your help. Your hint, I did not define the footer in the table, solve my problem. I forgot to define the Table footer,

    Thanks a lot
    Andreas

  • guilhermemaranhaoguilhermemaranhao Posts: 38Questions: 11Answers: 0

    Hi, @kthorngren !

    I've just followed what you've suggested here (http://live.datatables.net/fepanigo/1/edit), but the footer is not being displayed.

    I've also set this property on my datatable initialization:

    fixedHeader: {
                            header: false,
                                footer: true
                        },
    

    Do I need to explicitly define a

    <tfoot></tfoot>
    

    on my table?

    But even if I do it, when footerCallback is reached, the tfoot parameter is always undefined.

    Am I missing anything?

    Thank you

This discussion has been closed.