Question

我们有一个ExtJS v4.1组合框，我们将它绑定到商店并将其pageSize配置设置如下：

var myStore = Ext.create('Ext.data.Store', {
    model: 'User',
    remoteFilter: true,
    remotePaging: true,
    autoLoad: true
    proxy: {
        type: 'ajax',
        url: '/users.json',
        reader: {
            type: 'json',
            root: 'users'
        }
    },
    pageSize: 50,                  //   <= store pageSize
});

Ext.create('Ext.form.ComboBox', {
    fieldLabel: 'Choose',
    store: myStore,
    queryMode: 'remote',
    displayField: 'Name',
    valueField: 'Id',
    pageSize: 20                   //   <= combobo pageSize
});

作为documentation says，应使用组合框的pageSize属性来过滤queryMode='remote'时发送到服务器的ajax查询。但我们所看到的恰恰相反，它仅用于在组合框的底部显示分页工具栏（文档的第一条评论是这样说的）。

但是在这种特定情况下我们真正需要的是覆盖商店的pageSize属性，并使用combobox的pageSize属性来过滤ajax请求。

我们如何在组合框中实现/扩展这样的功能？我们如何在组合框中覆盖商店的pageSize属性？

Answer 1

尽管有文档，

comboBox中的pageSize实际上是一个真/假值。

在javascript中，如果它为0，则分页工具栏关闭，否则它会打开。

这是一个共享商店，还是仅仅用于组合框？

如果共享，则您需要保存商店的页面大小，必要时将其更改为组合，然后再将其设置为：

            {
                xtype: 'combobox',
                width: 350,
                store: new MyStore(),
                fieldLabel: 'Label',
                pageSize: 2,
                listeners:{
                    beforequery:function(queryEvent){
                        var combo = queryEvent.combo;
                        var store = combo.getStore();
                        var oldPageSize = store.pageSize;
                        store.on('load', function(){
                            this.pageSize = oldPageSize;
                        });
                        store.pageSize = combo.pageSize;
                    }
                }
            }

Answer 2

另一种实现此功能的方法是，在实例化时将参数/配置添加到商店。我就是这样做的

store: new Ext.create('MyStore',{pageSize:20}),
pageSize: true

如何解决ExtJS 4.1 Combobox pageSize错误？

2 个答案: