<script>
$(document).ready(function() {
    $('#portests').on('click',function(){   
        $('.test').toggle();
    });
    $('#portests1').on('click',function(){  
        $('.test1').toggle();
    });
        $('#example').DataTable( {
            dom: 'Bfrtip',
            buttons: [
            { extend: 'copyHtml5', footer: true },
            { extend: 'excelHtml5', footer: true },
            { extend: 'csvHtml5', footer: true },
            { extend: 'pdfHtml5', footer: true },
            { extend: 'print', footer: true }
        ],
            "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 this page
                pageTotal2 = api
                    .column( 2, { page: 'current'} )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
 
                // Update footer
                $( api.column( 2 ).footer() ).html(
                  '€ '+pageTotal2 // +' ( ₱'+ total + ')' ouput the total of all pages //
                );
                  // Total over this page
                pageTotal3 = api
                    .column( 3, { page: 'current'} )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
 
                // Update footer
                $( api.column( 3 ).footer() ).html(
                  '€ '+pageTotal3 // +' ( ₱'+ total + ')' ouput the total of all pages //
                );
                  // Total over this page
                pageTotal4 = api
                    .column( 4, { page: 'current'} )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
 
                // Update footer
                $( api.column( 4 ).footer() ).html(
                  '€ '+pageTotal4 // +' ( ₱'+ total + ')' ouput the total of all pages //
                );
                  // Total over this page
                pageTotal5 = api
                    .column( 5, { page: 'current'} )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
 
                // Update footer
                $( api.column( 5 ).footer() ).html(
                  '€ '+pageTotal5 // +' ( ₱'+ total + ')' ouput the total of all pages //
                );
                  // Total over this page
                pageTotal6 = api
                    .column( 6, { page: 'current'} )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
 
                // Update footer
                $( api.column( 6 ).footer() ).html(
                  '€ '+pageTotal6 // +' ( ₱'+ total + ')' ouput the total of all pages //
                );
            }           
        } );        
    } );
</script>
    <link href="tablejs/bootstrap-datepicker3.min.css">
    <script src="tablejs/bootstrap-datepicker.js"></script>



    
<script>
$.fn.dataTableExt.afnFiltering.push(
    function( oSettings, aData, iDataIndex ) {
        var iFini = document.getElementById('min').value;
        var iFfin = document.getElementById('max').value;
    var iStartDateCol = 7;
        var iEndDateCol = 7;

        iFini=iFini.substring(0,4) + iFini.substring(5,7)+ iFini.substring(8,10);
        iFfin=iFfin.substring(0,4) + iFfin.substring(5,7)+ iFfin.substring(8,10);

        var datofini=aData[iStartDateCol].substring(0,4) + aData[iStartDateCol].substring(5,7)+ aData[iStartDateCol].substring(8,10);
        var datoffin=aData[iEndDateCol].substring(0,4) + aData[iEndDateCol].substring(5,7)+ aData[iEndDateCol].substring(8,10);

        if ( iFini === "" && iFfin === "" )
        {
            return true;
        }
        else if ( iFini <= datofini && iFfin === "")
        {
            return true;
        }
        else if ( iFfin >= datoffin && iFini === "")
        {
            return true;
        }
        else if (iFini <= datofini && iFfin >= datoffin)
        {
            return true;
        }
        return false;
    }
);
</script>
<script>
$(document).ready(function() {   
    var table = $('#example').DataTable( {
        "order": [[ 7, '0' ]],
        "dom": 'litp',  // https://datatables.net/examples/basic_init/dom.html

    } );
    // Filter by Start and End Date
    var datepicker_options = {
      format: "dd-mm-yyyy",
      autoclose: true,
      clearBtn: true,
      endDate: "0d",
      todayHighlight: true,
    }
    $('#min, #max').datepicker(datepicker_options).on('changeDate', function(e) { table.draw(); } );
    $('#min, #max').change(function () {
        table.draw();
    });
} );
</script>

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.