使用CSDN-markdown编辑器 教程

extjs4 store加载一次后台数据，然后前台分页

store

store中主要涉及内容：

Ext.define("com.cxq.base.studentManage.student.store.Student", {
    extend: "Ext.data.Store",
 model:"com.cxq.base.studentManage.student.model.Student",
    pageSize: 2, // 指定每页显示2条记录
    autoLoad: true,
    data: null,  //数据由发请求后返回数据再赋值，具体看下面controller
    proxy: {
        type: 'mypagingmemory',  //引用的PagingMemoryProxy类
        reader: {
            type: 'json',
            totalProperty:'total'
        }
    }
});

controller

controller中主要内容
这里向后台发了一个ajax请求，返回数据放置store中：

Ext.Ajax.request({
    url : _ctx_ + "/studentSystem/student/list.action",
    params : param,
    method : "POST",
    success : function(res, opts) {
        var res = Ext.decode(res.responseText);
        if (res.success) {  
            var locateData = res.data;//返回的数据
            var store = me.getStore("Student"); 
            store.getProxy().data = locateData;
            store.loadPage(1);
        } else {
            commonQuickMsg.msg("加载数据失败！", data.msg);
        }
    }
});

面板中分页和平时一样：
bbar : {
xtype : “pagingtoolbar”,
displayInfo : true,
store : “Student”

-----------------------------------------------------   

注意：

我使用extjs4中源码的PagingMemoryProxy类时，报了一个错，断点跟踪后发现源码有几处没有判断是否为空。（filters 和sorters）
我修改后代码：

/**
 * Paging Memory Proxy, allows to use paging grid with in memory dataset
 */
Ext.define('Ext.ux.data.MyPagingMemoryProxy', {
    extend: 'Ext.data.proxy.Memory',
    alias: 'proxy.mypagingmemory',
    alternateClassName: 'Ext.data.MyPagingMemoryProxy',

    constructor: function() {
        Ext.log.warn('Ext.ux.data.MyPagingMemoryProxy functionality has been merged into Ext.data.proxy.Memory by using the enablePaging flag.');    
        this.callParent(arguments);
    },

    read : function(operation, callback, scope){
        debugger;
        var reader = this.getReader(),
            result = reader.read(this.data),
            sorters, filters, sorterFn, records;

        scope = scope || this;
        // filtering
        filters = operation.filters;
        if ( filters && filters.length > 0) {
            //at this point we have an array of  Ext.util.Filter objects to filter with,
            //so here we construct a function that combines these filters by ANDing them together
            records = [];

            Ext.each(result.records, function(record) {
                var isMatch = true,
                    length = filters.length,
                    i;

                for (i = 0; i < length; i++) {
                    var filter = filters[i],
                        fn     = filter.filterFn,
                        scope  = filter.scope;

                    isMatch = isMatch && fn.call(scope, record);
                }
                if (isMatch) {
                    records.push(record);
                }
            }, this);

            result.records = records;
            result.totalRecords = result.total = records.length;
        }

        // sorting
        sorters = operation.sorters;
        if (sorters && sorters.length > 0) {
            //construct an amalgamated sorter function which combines all of the Sorters passed
            sorterFn = function(r1, r2) {
                var result = sorters[0].sort(r1, r2),
                    length = sorters.length,
                    i;

                    //if we have more than one sorter, OR any additional sorter functions together
                    for (i = 1; i < length; i++) {
                        result = result || sorters[i].sort.call(this, r1, r2);
                    }                

                return result;
            };

            result.records.sort(sorterFn);
        }

        // paging (use undefined cause start can also be 0 (thus false))
        if (operation.start !== undefined && operation.limit !== undefined) {
            result.records = result.records.slice(operation.start, operation.start + operation.limit);
            result.count = result.records.length;
        }

        Ext.apply(operation, {
            resultSet: result
        });

        operation.setCompleted();
        operation.setSuccessful();

        Ext.Function.defer(function () {
            Ext.callback(callback, scope, [operation]);
        }, 10);
    }
});

源码：

/**
 * Paging Memory Proxy, allows to use paging grid with in memory dataset
 */
Ext.define('Ext.ux.data.PagingMemoryProxy', {
    extend: 'Ext.data.proxy.Memory',
    alias: 'proxy.pagingmemory',
    alternateClassName: 'Ext.data.PagingMemoryProxy',

    constructor: function() {
        Ext.log.warn('Ext.ux.data.PagingMemoryProxy functionality has been merged into Ext.data.proxy.Memory by using the enablePaging flag.');    
        this.callParent(arguments);
    },

    read : function(operation, callback, scope){
        var reader = this.getReader(),
            result = reader.read(this.data),
            sorters, filters, sorterFn, records;

        scope = scope || this;
        // filtering
        filters = operation.filters;
        if (filters.length > 0) {
            //at this point we have an array of  Ext.util.Filter objects to filter with,
            //so here we construct a function that combines these filters by ANDing them together
            records = [];

            Ext.each(result.records, function(record) {
                var isMatch = true,
                    length = filters.length,
                    i;

                for (i = 0; i < length; i++) {
                    var filter = filters[i],
                        fn     = filter.filterFn,
                        scope  = filter.scope;

                    isMatch = isMatch && fn.call(scope, record);
                }
                if (isMatch) {
                    records.push(record);
                }
            }, this);

            result.records = records;
            result.totalRecords = result.total = records.length;
        }

        // sorting
        sorters = operation.sorters;
        if (sorters.length > 0) {
            //construct an amalgamated sorter function which combines all of the Sorters passed
            sorterFn = function(r1, r2) {
                var result = sorters[0].sort(r1, r2),
                    length = sorters.length,
                    i;

                    //if we have more than one sorter, OR any additional sorter functions together
                    for (i = 1; i < length; i++) {
                        result = result || sorters[i].sort.call(this, r1, r2);
                    }                

                return result;
            };

            result.records.sort(sorterFn);
        }

        // paging (use undefined cause start can also be 0 (thus false))
        if (operation.start !== undefined && operation.limit !== undefined) {
            result.records = result.records.slice(operation.start, operation.start + operation.limit);
            result.count = result.records.length;
        }

        Ext.apply(operation, {
            resultSet: result
        });

        operation.setCompleted();
        operation.setSuccessful();

        Ext.Function.defer(function () {
            Ext.callback(callback, scope, [operation]);
        }, 10);
    }
});