ExtJs 网格分页不起作用

Posted 2023-02-26

【中文标题】ExtJs 网格分页不起作用

【英文标题】：ExtJs grid paging not working

【发布时间】：2013-03-13 11:40:28

【问题描述】：

我无法让我的网格与分页一起使用。这是我的代码（此代码在用户在 textField 控件中键入一些信息后在 controller.js 中执行）：

    var store = Ext.create('App.store.vo.Posts', 
        autoLoad: 
            params: 
                query: textTyped,
                start: 0,
                limit: 10
            ,
            callback: function (regs) 
                me.getGrid().reconfigure(store);
                me.getGrid().down('pagingtoolbar').bindStore(store);
            
        
    );

这是我的商店代码：

Ext.define('App.store.vo.Posts', 
    extend: 'Ext.data.Store',

    model: 'App.model.vo.Post',
    autoLoad: true,
    autoSync: false
);

网格正确填充了数据，但分页被禁用。

更新：

和 Post 模型：

Ext.define('App.model.vo.Post', 
    extend: 'Ext.data.Model',
    fields: [
        name: 'id', type: 'auto',
        name: 'text', type: 'auto'        
    ],
    idProperty: 'id',
    proxy: 
        type: 'rest',
        url : '/posts',
        format: 'json',
        reader: 
            root: 'data',
            successProperty: 'success',
            totalProperty: 'total'
        ,
        writer: 
            // wrap post params for Rails
            getRecordData: function(record) 
                return  post: record.data ;
            
        
    
);

【问题讨论】：

您是否在调试器 (firebug) 中检查过请求标头？

是的，第一页填满了网格。只有分页不起作用。

【参考方案1】：

我让它这样工作：

    //set the 'query' param before load 
    var store = Ext.create('App.store.vo.Posts', 
        listeners: 
            beforeload: function(s,op, ot) 
                op.params = 
                    query: filtro
                
            
        
    );


    store.load(
        callback: function (regs) 
            if (store.data.length > 0) 
                me.getGrid().getView().focus(true, 200);
                me.getGrid().getView().select(0);
            
        ,
        params: 
            query: filtro,
            field: campo,
            start: 0
        
    );
    me.getGrid().reconfigure(store);
    me.getGrid().down('pagingtoolbar').bindStore(store);

【参考方案2】：

你应该试试这个（见Ext.data.Operation）：

autoLoad: 
    start: 0,
    limit: 10,
    params:  ... ,
    callback: function ()  ... 

---

更新

我想知道是否需要pageSize 才能使分页工作。默认值设置为 25，也许你应该根据你想要的页面大小来设置这个属性：

var store = Ext.create('App.store.vo.Posts', 
    pageSize: 10

【讨论】：

不，这不起作用。我认为商店绑定有问题。

@paulo 所以问题一定来自模型。你能分享一下App.model.vo.Post 的定义吗？

我让它工作，将回调中的行移到“加载”块之外。但是现在，当我单击“下一步”时，“查询”参数不再传递给服务器..

@paulo autoLoad 不持久，请改用extraParams。