4

我们有一个 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
});

正如文档所说,组合框的pageSize属性应该用于过滤发送到服务器的 ajax 查询queryMode='remote'。但我们看到的是相反的,它只是用于在组合框底部显示一个分页工具栏(文档的第一条评论是这样说的)。

但是在这种特定情况下,我们真正需要的是覆盖pageSizestore 的属性,并使组合框的pageSize属性用于过滤 ajax 请求。

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

4

2 回答 2

2

尽管有文档,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;
                    }
                }
            }
于 2013-05-07T08:45:22.023 回答
1

另一种实现此功能的方法是在实例化时将参数/配置添加到存储中。这是我的做法

store: new Ext.create('MyStore',{pageSize:20}),
pageSize: true
于 2013-05-12T16:11:47.680 回答