js实现EasyUI-datagrid前台分页

 

//实现假分页
function myLoader(param, success, error) {
    var that = $(this);
    var opts = that.datagrid("options");
    if (!opts.url) {
        return false;
    }
    var cache = that.data().datagrid.cache;
    if (!cache) {
        $.ajax({
            type: opts.method,
            url: opts.url,
            data: param,
            dataType: "json",
            success: function (data) {
                that.data().datagrid['cache'] = data;
                success(bulidData(data));
            },
            error: function () {
                error.apply(this, arguments);
            }
        });
    } else {
        success(bulidData(cache));
    }

    function bulidData(data) {
        var temp = $.extend({}, data);
        var tempRows = [];
        var start = (param.page - 1) * parseInt(param.rows);
        var end = start + parseInt(param.rows);
        var rows = data.rows;
        for (var i = start; i < end; i++) {
            if (rows[i]) {
                tempRows.push(rows[i]);
            } else {
                break;
            }
        }
        temp.rows = tempRows;
        return temp;
    }
}

加载datagrid时的调用

 

$('#dg').datagrid({
                   loadMsg: '正在努力为您加载数据',
                   url: 'Handler.ashx?action=GetData' + "&Id=" +Id,
                   fitColumn: false,
                   pageNumber: 1,
                   pagination: true,//分页控件
                   rownumbers: true,//显示行号
                   pageSize: 3,
                   pageList: [3, 15, 50, 100],
                   loader: <span style="color:#ff0000;">myLoader</span>, //前端分页加载函数
                   onLoadSuccess: function (data) {
                       $("#dg").data().datagrid.cache = null;//清除datagrid 缓存，保证前台假分页；
                      //$('#dg').datagrid('reload');显示更新后的数据
                   }
               });