javascript - Pagination on filtered rows — Resetting original data set — jQuery Datatables -

this problem had jquery datatables don't know why happening in first place!

i have multiple select elements filters original data set. filtering logic on select change event.

this datatables init (using state saving, documentation) :

var table = $('#orders-listing').datatable({    bstatesave: true,     bfilter:true,     paging: true,     bpaginate:true,    language: { url: /* language file url */ },    fnstatesave: function(osettings, odata){      localstorage.setitem('datatables_'+window.location.pathname, json.stringify(odata));    },    fnstateload: function(osettings){      return json.parse(localstorage.getitem('datatables_'+window.location.pathname));    } }); 

and filtering logic on select change event:

$('.filter-select').on('change', function() {    $.fn.datatable.ext.afnfiltering.push(      function(settings, data, dataindex) {           // logic, return boolean, wether keep row being processed or not.      }   );    table.draw();    $.fn.datatable.ext.afnfiltering.pop(); }); 

now, filtering works fine. rows, pagination links, changes accordingly. but, once click on 2nd link on pagination links, original dataset returns.

example: had 200 rows in first place, after filtering, reduced 150 (so 50 rows filtered, , removed original dataset), once click on second link on pagination, original dataset returns, first 200 rows.

what missing here ? causing original dataset return when paginating ?

any appreciated. thanks.

you're doing $.fn.datatable.ext.afnfiltering.pop() after drawing table draw() removes custom filter , no longer applied if table sorted, page changed, etc.

try adding $.fn.datatable.ext.afnfiltering.pop() before $.fn.datatable.ext.afnfiltering.push() remove previous custom filter on filter change before adding new filter.