ExtJs combobox pagingtoolbar properties

Question

I have combobox with remote store in the gridpanel editor cell (I use rowEditing plugin). With using a "pageSize" properties of combobox I have pagingtoolbar at the bottom of expanded combobox.

example: http://docs.sencha.com/extjs/4.2.2/#!/example/form/forum-search.html

But I need to change some properties of this pagingtoolbar, for example "beforePageText", "afterPageText", "displayMsg" and so on. In the gridpanel I can add dockedItems and set any property, but what about combobox? There is no config for it.

Thanks for all replies and help.

var store = Ext.create('Ext.data.ArrayStore', {
                        fields: ['ID', 'NAME'],
                        pageSize: 10,
                        autoLoad: false,
                        proxy: {
                            type: 'ajax',
                            url: 'someurl'
                            reader: {
                                type: 'json',
                                root: 'data'
                            }
                        }
                    });

//And properties of my column editor

gridColumn.editor.xtype = 'combobox';
gridColumn.editor.store = store;
//with this we have pagingtoolbar at the bottom of combobox
gridColumn.editor.pageSize = 20;
gridColumn.editor.valueField = 'ID';
gridColumn.editor.displayField = 'ID';

score 3 · Accepted Answer · answered Jun 23 '14 at 17:05

3

Unfortunately, configuration of the paging toolbar is not easily possible. The paging is created as a part of BoundList creation (that is Combo picker) and no config options are honored. See BoundList source:

createPagingToolbar: function() {
    return Ext.widget('pagingtoolbar', {
        id: this.id + '-paging-toolbar',
        pageSize: this.pageSize,
        store: this.dataSource,
        border: false,
        ownerCt: this,
        ownerLayout: this.getComponentLayout()
    });
}

You could configure your own picker on the combo but it is not documented config option or you could override createPicker() method - also not documented.

answered Jun 23 '14 at 17:05

Saki

5,827
2
15
15

Thanks for answer. Please, tell me why I can not override just "createPagingToolbar" function? – tytyryty Jun 24 '14 at 08:11
Of course you can, however doing so would change it for all combos - all is fine if you want that. If you want it only for one, or several combos then the own picker or override of createPicker is better. – Saki Jun 24 '14 at 10:05
But overriding "createPicker" also change all comboboxes, don't it? I mean an override like this `Ext.define('ExtApp.form.field.ComboBox',{ override: 'Ext.form.field.ComboBox', createPicker: function () { //override }); ` – tytyryty Jun 24 '14 at 11:09
Well, you can just define method `createPicker` on each combo that requires the special paging, not globally as above. – Saki Jun 24 '14 at 11:53

ExtJs combobox pagingtoolbar properties

1 Answers1