EasyUI过滤器和服务器端分页jquery冲突答案

【问题标题】：EasyUI Filter and serverside pagination jquery ConflictEasyUI过滤器和服务器端分页jquery冲突
【发布时间】：2014-10-31 03:02:50
【问题描述】：

我正在使用 EasyUI 和 Liferay MVC portlet。我在同一个数据网格上应用了服务器端分页和 DataGrid 过滤器。没有过滤器 DataGrid 分页工作正常。但是当我应用过滤器时，分页的下一页上没有显示任何数据。经过一番努力，我发现在 DataGrid 过滤器插件的 JS (datagrid-filter.js) 中，他们已经为分页完成了这段代码：

if (opts.pagination){
    var dg = $(this);
    var pager = dg[name]('getPager');
    pager.pagination({
        onSelectPage:function(pageNum, pageSize){
            opts.pageNumber = pageNum;
            opts.pageSize = pageSize;
            pager.pagination('refresh',{
                pageNumber:pageNum,
                pageSize:pageSize
            });

            //dg.datagrid('loadData', state.filterSource);
            dg[name]('loadData', state.filterSource);
        },
        onBeforeRefresh:function(){
            //dg('reload');
            dg[name]('reload');
            return false;
        }
    });
    if (name == 'datagrid'){
        var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
        var end = start + parseInt(opts.pageSize);
        data.rows = data.rows.slice(start, end);
    } else {
        var topRows = [];
        var childRows = [];
        $.map(data.rows, function(row){
            row._parentId ? childRows.push(row) : topRows.push(row);
        });
        data.total = topRows.length;
        var start = (opts.pageNumber-1)*parseInt(opts.pageSize);  
        var end = start + parseInt(opts.pageSize);  
        data.rows = $.extend(true,[],topRows.slice(start, end).concat(childRows));
    }
}

现在如果我评论这一行：

dg[name]('loadData', state.filterSource);

然后分页正常工作，但过滤器没有任何响应。我该如何解决这个问题？

【问题讨论】：

标签： datagrid pagination jquery-easyui jquery-pagination jquery-filter

【解决方案1】：

要解决此问题，您应该按照以下步骤操作：

确保remoteFilter是false（默认为false）；
不要在 sql 查询中使用 limit 和 offset

了解

在正常分页中，当点击下一个或上一个时，EasyUi 会向服务器发送带limit 和offset 的参数，以分页限制结果。使用filter时，如果remoteFilter为false，则分页表在本地出现。因此，您不需要使用 limit 和 offset 来获取所有结果。

示例

$('#table').datagrid({
      your code here....
  }).datagrid('enableFilter');

【讨论】：