覆盖下一步和上一个按钮分页工具栏sencha extjs 4.1



我有一个问题的分页工具栏在我的应用程序。我的商店是由PHP脚本,转换MySQL数据库表JSON数据填充。

在我的窗口,我有一个面板的形式,我用它来过滤网格。所有的"过滤器"都作为参数在store.load()调用中传递,PHP脚本完成查询并返回数据。

我的问题是,当我有一些过滤器,我点击分页工具栏的下一个按钮,我的过滤器消失,存储加载没有额外的参数。我怎么能发送额外的参数在nextPage()/prevPage()调用?

编辑:我解决使用store.on('beforeload'),这是我的解决方案:

store.on('beforeload', function(store, operation, opts){
   operation.params={
       // yuor params here
       param1: param1Value,
       param2: param2Value
   };
}, this);

您需要重写分页工具栏的moveNext和movePrevious方法,在这些方法中您可以传递一个对象,其中包含您需要传递给PHP的所有自定义参数

/**
 * Move to the next page, has the same effect as clicking the 'next' button.
 */
moveNext : function(){
    var me = this,
        total = me.getPageData().pageCount,
        next = me.store.currentPage + 1;
    if (next <= total) {
        if (me.fireEvent('beforechange', me, next) !== false) {
            me.store.nextPage({
                // all the custom params should go here
                param1 : 'value1'
            });
        }
    }
}

这将很容易地解决你当前的问题,但如果你想要一个通用的修复,商店将提供这些自定义参数每次从商店获取上一个/下一个页面,然后你可以覆盖loadPage方法,并添加自定义参数

loadPage: function(page, options) {
    var me = this;
    me.currentPage = page;
    // add your custom params
    options = Ext.apply({
        param1 : 'value1'
    }, options);
    // Copy options into a new object so as not to mutate passed in objects
    options = Ext.apply({
        page: page,
        start: (page - 1) * me.pageSize,
        limit: me.pageSize,
        addRecords: !me.clearOnPageLoad
    }, options);
    if (me.buffered) {
        return me.loadToPrefetch(options);
    }
    me.read(options);
}
参考:

http://docs.sencha.com/ext-js/4-1/source/Paging.html Ext-toolbar-Paging

http://docs.sencha.com/ext-js/4-1/source/Store.html Ext-data-Store-method-nextPage

我不知道你是否找到了你的答案,但我有同样的问题,这是我发现的。

希望有帮助。

带参数的调用只能进行一次。在以前的版本中,Sencha告诉使用baseParams,但我无法在较新的版本中找到它。所以我这样使用代理的extraParams:

这是我用来过滤数据的表单按钮

text: 'Filter',
handler: function() {
        /*
        get the form
        get a record object and set its data
        */
        var form = this.up('form').getForm();
        var record = form.getRecord();
        form.updateRecord(record);
        for(name in record.data){
            if (record.data.hasOwnProperty(name))
                envelopeStore.setExtraParam(name, record.data[name]);
        }
        /*
        envelopeStore.getProxy().extraParams = record.data;
        *I have some constant params so I needed to add them in a loop as above
        *you can simply use this
        */
        envelopeGrid.child('pagingtoolbar').moveFirst(); 
        /*
        do not load store data. It does not change paging. go to first page instead
        */
    }    

最新更新