Question

ExtJs分页代码在 Firefox 上无法正常工作，在IE10，Chrome等其他浏览器上运行正常。

我使用过ExtJs 4.1.1。在那一部分，我为comboGrid定义了一个分页工具栏，并根据我的分页工作。我编写了这样的代码：

var bar = new Ext.PagingToolbar({
    store: Store,
    displayInfo: true,
    itemid:'paginationToolbar',
    items: [
    '-',
    'Per Page: ',
    combo],         
    displayMsg: 'Display {0} - {1} of {2}',
    emptyMsg: "No display",
    handleRefresh: Ext.emptyFn,
    doRefresh: function() {
        // Logic
    }
});

并在Ext.apply方法上应用此栏。

Answer 1

将您的数据转储到网页正文中的JSON，改为使用此jQuery's plugin。

请参阅loading data (JSON)和Pivot Grid示例。

Answer 2

我在blog上写了一些关于此的内容，最近遇到了类似的问题。下面的代码适用于ExtJS 4（无法记住版本），它绝对适用于ExtJS 6.0.0和ExtJS 6.0.1。我之所以会感到惊讶，原因就是版本号，因为最初的博客文章基于几年前的日期 - 所以它应该适用于您选择的任何版本。

Ext.define('Ext.toolbar.PagingComboToolbar', {
extend: 'Ext.PagingToolbar',
displayInfo: true,
pageSize: 50,  
displayMsg: 'Display {0} - {1} of {2}',
emptyMsg: "No display",
initComponent: function () {
    var me = this;
    this.store.pageSize = this.pageSize;
    var combo = new Ext.form.ComboBox({
        name: 'perpage',
        width: 75,
        store: new Ext.data.ArrayStore({
            fields: ['id'],
            data: [
              ['10'],
              ['20'],
              ['50'],
              ['75'],
              ['100'],
              ['150']
            ]
        }),
        value: this.pageSize,
        listWidth: 70,
        triggerAction: 'all',
        displayField: 'id',
        valueField: 'id',
        editable: false,
        forceSelection: true,
        listeners: {
            select: {
                fn: function (combo, record) {
                    var newPagesize = parseInt(record.get('id'), 10);
                    this.pageSize = newPagesize;
                    this.store.pageSize = newPagesize;
                    this.store.loadPage(this.store.currentPage);
               },
                scope: this
            }
        }
    });

    Ext.apply(this, {
        items: [
            'Per page: ', 
            combo
        ]
    });

    this.callParent(arguments);
}
});

然后你这样称呼它：

var bar = new Ext.toolbar.PagingComboToolbar({
store: Store,     
handleRefresh: Ext.emptyFn,
doRefresh: function() {
    // Logic
}
});

当然，如果你的组合框的行为有点不同，你可以替换它。或者你可以扩展整个类，以便它能够在构造函数中接受comoboxes。

ExtJs4.1.1 pagingToolBar不适用于Firefox

2 个答案: