PDA

View Full Version : [4.1.0PR] Paging toolbar with combobox in overflow menu



zombeerose
9 Nov 2011, 10:25 AM
REQUIRED INFORMATION

Ext version tested:

Ext 4.1 rev 0
Browser versions tested against:

FF7 (firebug 1.8 installed)
DOCTYPE tested against:

Strict
Description:

I have a plugin that appends a combobox to a paging toolbar, which allows a user to select the page size from a predefined list. However, when the width of the container forces the toolbar to overflow, the combo width is incorrect and is missing the trigger button.
Steps to reproduce the problem:

Run the code.
Click the overflow button to view the combo.
The result that was expected:

The combo should display the trigger button.
The result that occurs instead:

The input area for the combo is visible but not the trigger.
Test Case:



Ext.define('Ext.ux.toolbar.PageSize',{
alias: 'plugin.pagesize',
extend: 'Ext.AbstractPlugin',
requires: ['Ext.form.field.ComboBox'],

init: function(tb){
tb.on('beforerender', function(){
tb.add(
'-',
{ text: 'Before', xtype:'tbtext'}, //overflowText: 'Before',
{
allowBlank: false,
displayField: 'value',
editable: true,
forceSelection: false,
queryMode: 'local',
maskRe: /[0-9]/,
maxLength: 3,
store: Ext.create('Ext.data.ArrayStore',{
data: [[25],[50]],
fields: ['value']
}),
value: 25,
valueField: 'value',
width: 50,
xtype: 'combo'
},
{ text: 'After', xtype:'tbtext'} //overflowText: 'After',
);
});

this.callParent(arguments);
}
});


Ext.require([
'Ext.toolbar.Paging'
]);


Ext.onReady(function(){
Ext.create('Ext.window.Window',{
dockedItems: [{
displayInfo: true,
dock: 'bottom',
enableOverflow: true,
plugins: [{
ptype: 'pagesize'
}],
xtype: 'pagingtoolbar'
}],
html: 'Example of paging toolbar with a plugin that uses a combo for selecting the page size.',
width: 275,
height: 100

}).show();
});


HELPFUL INFORMATION

Possible fix:

not provided
Additional CSS used:

only default ext-all.css
Operating System:

WinXP Pro

mitchellsimoens
10 Nov 2011, 5:25 AM
When using Ext.create, you shouldn't specify the requires property like that, you should use Ext.require()

zombeerose
10 Nov 2011, 7:50 AM
@mitchellsimoens

I updated the code example. Their is still a bug.


When using Ext.create, you shouldn't specify the requires property like that, you should use Ext.require()