Individual column searching (text inputs) not working

xixzeroxix

Im using Individual column searching (text inputs) like in the example : https://www.datatables.net/examples/api/multi_filter.html
but my text inputs dont filter the data, what im doing wrong?
This is my javascript:

$(document).ready(function () {
        $('#pftable_hdr tfoot th').each(function () {
            var title = $(this).text();
            $(this).html('<input type="text" name="filter" value="" id="filter" placeholder="Search ' + title + '" />');
        });
        var table = $('#pftable_hdr').DataTable({
            "bFilter": true,
            "sDom":"lrtip", 
             "ajax": {
        "url": "/path.txt",
        "dataSrc": ""

             },
             scrollY: "500px",
             scrollX: true,
             scrollCollapse: true,
             fixedColumns: {
                 leftColumns: 3
             },

        });

        table.columns().every( function () {
            var that = this;

            $( 'input', this.footer() ).on( 'keyup change', function () {
                if ( that.search() !== this.value ) {
                    that
                        .search( this.value )
                        .draw();
                }
            })
        });

        var oTable;
        oTable = $('#pftable_hdr').dataTable();
        $('.filter').change(function () {
           oTable.fnFilter($(this).val());
        });


    });

sunnyJS

Use my code
Its working like charm, and hope you can help me to get the text back

bejbe01

sunnyJS I tried to use your code but not working for me, with no error

jr42.gordon

Why do you have two instances of DataTables for the same id? Please remove the second instance, oTable, and try again.