Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-9402 in a recent build.
  1. #1
    Sencha Premium Member joshua.ball@osi.com's Avatar
    Join Date
    Nov 2012
    Location
    Sacramento, CA
    Posts
    43
    Vote Rating
    1
    joshua.ball@osi.com is on a distinguished road

      0  

    Default ExtJS 4.1.3 - Bug with Ext.Grid.Panel Reconfigure Function

    ExtJS 4.1.3 - Bug with Ext.Grid.Panel Reconfigure Function


    Hello All,

    I've come across some behavior with the reconfigure function that is repeatable and unexpected. In the following example, if grid columns do not have any widths initially they render misaligned. Sort indicators and state keeping is also ignored. I've also noticed that columns sporadically lay out with the order incorrect.

    Please see this thread for a history of this bug (worked with jsakalos):

    http://www.sencha.com/forum/showthre...Ext.Grid.Panel

    Thanks,


    * EDITED BY SLEMMON
    Code:
    var gridData = [
        [{
            id: 1,
            text: 'Item 1',
            type: 'a'
        }, {
            id: 2,
            text: 'Item 2',
            type: 'c'
        }, {
            id: 3,
            text: 'Item 3',
            type: 'b'
        }, {
            id: 4,
            text: 'Item 4',
            type: 'b'
        }, {
            id: 5,
            text: 'Item 5',
            type: 'a'
        }, {
            id: 6,
            text: 'Item 6',
            type: 'b'
        }, {
            id: 7,
            text: 'Item 7',
            type: 'c'
        }, {
            id: 8,
            text: 'Item 8',
            type: 'a'
        }, {
            id: 9,
            text: 'Item 9',
            type: 'c'
        }, {
            id: 10,
            text: 'Item 10',
            type: 'b'
        }
    ],
    [{
            id: 1,
            city: 'New York',
            country: 'U.S.A.'
        }, {
            id: 2,
            city: 'London',
            country: 'United Kingdom'
        }, {
            id: 3,
            city: 'Sydney',
            country: 'Australia'
        }, {
            id: 4,
            city: 'Los Angeles',
            country: 'U.S.A.'
        }, {
            id: 5,
            city: 'Melbourne',
            country: 'Australia'
        }, {
            id: 6,
            city: 'Montreal',
            country: 'Canada'
        }, {
            id: 7,
            city: 'Paris',
            country: 'France'
        }, {
            id: 8,
            city: 'Nice',
            country: 'France'
        }, {
            id: 9,
            city: 'Rome',
            country: 'Italy'
        }, {
            id: 10,
            city: 'Liverpool',
            country: 'United Kingdom'
        }
    ]
    ];
    
    
    fields = [
        ['id', 'text', 'type'],
        ['id', 'city', 'country']
    ];
    sorters = [
        [{
                property: 'type',
                direction: 'ASC'
            }
        ],
        [{
                property: 'country',
                direction: 'DESC'
            }
        ]
    ];
    // working 
    //            ,gridColumns = [[ 
    //                {header:'Item', dataIndex:'text', flex:1},{header:'Type', dataIndex:'type'} 
    //            ],[ 
    //                {header:'City', dataIndex:'city', flex:1},{header:'Country', dataIndex:'country'} 
    //            ]]              
    // misaligned columns and header             
    
    
    gridColumns = [
        [{
                header: 'Item',
                dataIndex: 'text'
            }, {
                header: 'Type',
                dataIndex: 'type'
            }
        ],
        [{
                header: 'City',
                dataIndex: 'city'
            }, {
                header: 'Country',
                dataIndex: 'country'
            }
        ]
    ];
    rIndex = 0;
    stores = [];
    g = Ext.create('Ext.grid.Panel', {
        title: 'Grid reconfigure',
        forceFit: true,
        renderTo: Ext.getBody(),
        width: 300,
        height: 400,
        columns: [],
        stateful: true,
        stateId: 'grid',
        viewConfig: {
            emptyText: 'No records found. Click Reconfigure button.',
            deferEmptyText: false
        },
        tbar: [{
                text: 'Reconfigure',
                handler: function () {
                    if (!stores[rIndex]) {
                        stores[rIndex] = Ext.create('Ext.data.Store', {
                            fields: fields[rIndex],
                            data: gridData[rIndex],
                            sorters: sorters[rIndex]
                        });
                    }
                    this.up('gridpanel').reconfigure(stores[rIndex], gridColumns[rIndex]);
                    rIndex = rIndex === 0 ? 1 : 0;
                }
            }
        ]
    });
    Last edited by slemmon; 8 Apr 2013 at 11:51 AM. Reason: format example code

  2. #2
    Sencha Premium Member joshua.ball@osi.com's Avatar
    Join Date
    Nov 2012
    Location
    Sacramento, CA
    Posts
    43
    Vote Rating
    1
    joshua.ball@osi.com is on a distinguished road

      0  

    Default Caught something else

    Caught something else


    Need to add to this. After a reconfigure, the "columns" option of the grid header's context menu shows all columns checked (meaning that they should be visible). I unchecked all columns except for a single one and triggered a reconfigure. After that, I looked at the "columns" option of the grid header's context menu and found that all columns were still checked even though only a single column should be visible.

    If possible, I'd like to request that this bug fix be expedited as I don't have a workaround for this issue.

    Thanks!

    -Josh

  3. #3
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    6,062
    Vote Rating
    215
    slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of

      0  

    Default


    Thanks for the report! I have opened a bug in our bug tracker.

  4. #4
    Sencha Premium Member joshua.ball@osi.com's Avatar
    Join Date
    Nov 2012
    Location
    Sacramento, CA
    Posts
    43
    Vote Rating
    1
    joshua.ball@osi.com is on a distinguished road

      0  

    Default


    NP, and thanks for the acknowledgement!

  5. #5
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,167
    Vote Rating
    674
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    The problem is because of forceFit, it's a legacy config we've kept that doesn't really gel with the current layout system. The simplest workaround is to manually refresh the view after reconfiguring.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  6. #6
    Sencha Premium Member joshua.ball@osi.com's Avatar
    Join Date
    Nov 2012
    Location
    Sacramento, CA
    Posts
    43
    Vote Rating
    1
    joshua.ball@osi.com is on a distinguished road

      0  

    Default


    Thanks Evan! My workaround involved reloading the store, but this will be much less costly.

Thread Participants: 2

Tags for this Thread