Individual column search not working For onscroll data loading

ajayjaiswal

Hi everyone...

I have implemented on scroll paging and appending data to DataTable when scroll hits bottom of the page. I am using individual column search(select Inputs), the newly appended data is not reflecting in dropdown at each column.
I am using:
1) jquery.dataTables.min.js
2) jquery.dataTables.yadcf.js

This is my code.

function PagingAccountGrid(pageNumber) {
$.ajax({
url: '/AccountListing/LoadData',
type: "Post",
data: { pageNumber: pageNumber },
success: function (result) {
var emptbl = $('#accountlistingFilter tbody');
emptbl.append(result);

            $('#accountlistingFilter').dataTable(
        {
            retrieve: true,
            "scrollX": "true",
            "paging": false,
            "info": false,
            "iDisplayLength": 100,
            "columnDefs": [{
                "orderable": false,
                "targets": [0, 3, 4, 14]
            }],
            "order": [[8, 'asc']],
            "fnDrawCallback": function (o) {
                $('.dataTables_scrollBody').scrollTop(o);
            }
        }
        ).yadcf([
        { column_number: 1 },
        { column_number: 2 },
        { column_number: 5 },
        { column_number: 6 },
        { column_number: 7 },
        { column_number: 8 },
        { column_number: 9 },
        { column_number: 10 },
        { column_number: 11 }]);


    },
});

}

jr42.gordon

Try configuring your DataTable with the following options:
ajax, make sure and read the "Related" section
deferRender