[4.1] Packing to 'center' on paging toolbar with displayInfo: true does not work

**jmaia** · 4 May 2012 2:25 AM

REQUIRED INFORMATION

Ext version tested:

Ext 4.1

Browser versions tested against:

IE9
FF12
Chrome (latest)

DOCTYPE tested against:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Description:

After upgrading to 4.1 from 4.0.7, my grid toolbars, that are all configured with layout: { pack: center }, are not aligned to the center anymore. After further investigation I discovered that it's because I have displayInfo: true on the toolbar config as well. If I remove displayInfo or set it to false, the toolbar components are aligned to the center. If I set displayInfo to true, the components get aligned to the left, and the info to the right.

Steps to reproduce the problem:

Just create a toolbar on a grid and set displayInfo: true and layout: {pack: 'center'} or layout: {type: 'hbox', pack: 'center'}

The result that was expected:

All the elements on the toolbar, including the paging control buttons and display info are centered (this was the behavior on 4.0.7)

The result that occurs instead:

The paging controls are aligned to the left, and display info to the right, no matter what packing I define on the layout(

Test Case:

Just add the following toolbar definition to a grid:

Code:

pager = Ext.widget('pagingtoolbar', {    
    dock: 'bottom',
    displayInfo: true,    // if I remove this it works
    layout: {
        pack:'center'
    },
    store: this.store
});

HELPFUL INFORMATION

Screenshot or Video:

See this URL for live test case:

Debugging already done:

none

Possible fix:

not provided

Additional CSS used:

only default ext-all.css
custom css (include details)

Operating System:

Win7 Professional (64)

**scottmartin** · 4 May 2012 5:53 AM

Thank you for the report.

Regards,
Scott.

**evant** · 5 May 2012 9:03 PM

This isn't a bug. By default if you include displayInfo, it includes a {flex: 1} component to push the displayInfo to the right. You'll need to override the item creation of the toolbar if you want a different behaviour.

**jmaia** · 7 May 2012 1:17 AM

Evan,

1. That behavior is not documented on the paging toolbar documentation.

2. This was not the behavior on 4.0.7. On 4.0.7 even if you had displayInfo, if you had a layout with pack: center, then the contents would get centered on the toolbar.

Do you think that if one of your customers already has an application with that layout (i.e. paging toolbar contents centered), he will be pleased to know that sencha's response to this undocumented change of behavior from 4.0.7 to 4.1 is "sorry, but that's the way it is now, so if you want it like you had before, you should fix it yourselves" ? I think not.

Being part of a development team of a product I understand that we have the need to close as many bugs as possible, but please do not be so quick to dismiss issues like this one without first listening to your client's motivations and reasons.

When a platform suddenly changes the behavior of a given functionality without any documentation or warning to the customers that are already using that functionality at least there should be some information about it, otherwise any change in behavior will most certainly be considered a bug. If not by yourselves, at least by the client who is paying for your platform.

If this change is documented somewhere, then please tell me where it is and I stand corrected.

Regards,

Joao Maia

**evant** · 7 May 2012 3:02 AM

In 4.1.0 there were a number of layout inconsistencies that changed behaviour in some cases. This particular instance is included in those cases.

The PagingToolbar has always had a flex: 1 component to force the displayInfo to the right if it was to be included, however a layout bug in 4.0.x allowed the original behaviour you're describing. A flex item should always use up any available space. Unfortunately, since you relied on this broken behaviour it's caused a problem for you.

Certainly this isn't ideal, however we aren't going to reintroduce a bug into the library to preserve the old way of doing things, especially since it will have wider implications outside of this case.

To fix it for your use case, you can use:

Code:

toolbar.down('#displayItem').prev().destroy();

**jmaia** · 7 May 2012 3:18 AM

Evan,

Thank you for your update on this issue. This now makes more sense. Thank you also for the correction. I tested it and it works.

Regards,

Joao Maia

[4.1] Packing to 'center' on paging toolbar with displayInfo: true does not work

Thread Tools

Search Thread

Display

[4.1] Packing to 'center' on paging toolbar with displayInfo: true does not work

[4.1] Packing to 'center' on paging toolbar with displayInfo: true does not work