How to render the footer responsive like a simple row?

iotivedo

Hello, I've a datatable like this:

<table id="data_table" class="table table-striped table-bordered datatable dt-responsive table-hover" style="width:100%;">
                            <thead>
                            <tr>
                                <th>1</th>
                                <th>2</th>
                                <th>3</th>
                                <th>4</th>
                                <th>5</th>
                                <th>6</th>
                                <th>7</th>
                                <th>8</th>
                                <th>9</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                            <tfoot>
                            <tr role="row" style="background-color: #ebebeb">
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th style="background-color: #c5fdb3;"></th>
                            </tr>
                            </tfoot>
                        </table>

In the footer I show the total of every column (see attached image), I use footerCallback function

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

The problem coming with the responsive feature of the table, in the footer the last columns are not visible as in the rows
but in the footer I don't have the "+" button to show other data.

How can I resolve this problem?

iotivedo

I need help,
I've also posted in this forum
https://github.com/yajra/laravel-datatables/issues/793
without success.