对过滤行进行分页 — 重置原始数据集 — jQuery 数据表

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

本文关键字:原始数据 数据集 jQuery 数据表 原始 过滤 分页      更新时间:2023-09-26

这是我在jQuery数据表上遇到的一个问题,我真的不知道为什么会发生这种情况!

我有多个选择元素,它们都过滤原始数据集。我对选择更改事件执行过滤逻辑。

这是我的数据表初始化(使用状态保存,来自文档(:

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));
   }
});

这是我对选择更改事件的过滤逻辑:

$('.filter-select').on('change', function() {
  $.fn.dataTable.ext.afnFiltering.push(
     function(settings, data, dataIndex) {
          // Some logic, return a boolean, wether we keep the row being processed or not.
     }
  );
  table.draw(); 
  $.fn.dataTable.ext.afnFiltering.pop();
});

现在,过滤工作正常。行,分页链接,一切都会相应更改。但是,一旦我单击分页链接上的第二个链接,原始数据集就会返回。

示例:我首先有 200 行,过滤后减少到 150 行(因此过滤了 50 行,并从原始数据集中删除(,然后一旦我单击分页上的第二个链接,原始数据集就会返回,前 200 行。

我在这里错过了什么?是什么导致原始数据集在分页时返回?

任何帮助将不胜感激。谢谢。

您在使用 draw() 绘制表格后立即执行$.fn.dataTable.ext.afnFiltering.pop(),这会删除您的自定义过滤器,如果表格被排序、页面更改等,它将不再应用。

尝试在$.fn.dataTable.ext.afnFiltering.push()之前添加$.fn.dataTable.ext.afnFiltering.pop(),以便仅在更改过滤器时但在添加新过滤器之前删除以前的自定义过滤器。