table.columns is not a function in datatable.js

Question

<script>

    jQuery(document).ready(function () {


        $('#sample_3 tfoot th').each(function () {

            var title = $('#sample_3 thead th').eq($(this).index()).text();

            $(this).html('<input type="text" placeholder="Search ' + title + '" />');
        });

        // DataTable
        var table = $('#sample_3').dataTable();

        // Apply the filter
        table.columns().eq(0).each(function (colIdx) {

            $('input', table.column(colIdx).footer()).on('keyup change', function () {

                table
                    .column(colIdx)
                    .search(this.value)
                    .draw();
            });
        });

    });
</script>

I got table.columns is not a function js error , what is missing i am not understand.

source : https://datatables.net/examples/api/multi_filter.html

Answer 1

Try changing

var table = $('#sample_3').dataTable();

to

var table = $('#sample_3').DataTable();

... that is, capitalize the DataTable(). Source: https://datatables.net/manual/api#Accessing-the-API