How to make datatable footer appear on the print page

Question

I have only seen two question here about this and it didnt work/ i didnt understand it. This is my table

<table class="table table-bordered make_datatable">
    <thead>
        <tr>
            <th>SL No</th>
            <th>Member Code</th>
            <th>Name</th>
            <th>Total</th>
        </tr>                                    
    </thead>
    <tbody>            
        <tr>
            <td></td>
            <td>11910</td>
            <td>KRATOS</td>
            <td>SH001</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <th colspan="3" style="text-align:right">Grand Total:</th>
            <th></th>
        </tr>
    </tfoot>
</table>

everything else is printing correctly and i have used the customize option to print the footer for now but i'd like to know how to print this along with the datatable, jquery for datatable:

var make_datatable = $('.make_datatable').DataTable( {
        "columnDefs": [{
            "searchable": false,
            "orderable": false,
            "targets": 0,
        }],

        "searching": false,
        "order": [ 1, 'asc'],
        dom: 'Blfrtip',
        buttons: [
        {   
            extend: 'print',
            title : ' ', 
            text: '<i class="glyphicon glyphicon-print"></i><span>Print</span>',
            className: 'btn btn-info printclass textSan' ,
            customize: function ( win ) {
                $(win.document.body)
                    .prepend(
                        '@include("report/memberreportheader")'
                    );
                $(win.document.body)
                    .append(
                        '@include("report/shop/printmemberconsolidate")'
                    )
            }
        },
        ],
    });

Answer 1

solved it by using footer: true and removed the colspan and added th to match other rows

buttons: [
                    {
                        extend: 'print',
                        footer: true,
                        title: ' ',
                        text: '<i class="glyphicon glyphicon-print"></i><span>Print</span>',
                        className: 'btn btn-info printclass textSan',
                        customize: function (win) {
                            $(win.document.body)
                                .prepend(
                                    '@include("report/memberreportheader")'
                                );
                        }
                    },
                ]

HTML:

<tr>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th>Grand Total:</th>
                                <th>{{$total}}</th>
                                <th>--</th>
                            </tr>