DataTables warning: table id=example - Cannot reinitialise DataTable. , Cant Solve Please help

Subhamoy

<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.

colin

As the error says, you're initialising the table twice, with different options - on lines 9 and 134. You need to tweak your code so there's only one $(document).ready() and initialise the table once in it.

Colin

Subhamoy

Yes , I know that . only one $(document).ready() require , but what will be the code ? How I marge it

tangerine

Please show us your code, assuming you have amended it in accordance with Colin's advice.

allan

See this part of the manual for how to merge options into a single object.

Allan