1. #1
    Ext User
    Join Date
    Aug 2008
    Posts
    13
    Vote Rating
    0
    melfice is on a distinguished road

      0  

    Default Problems in IE with GridPanel and forceFit

    Problems in IE with GridPanel and forceFit


    I have got the old Problem that the width of the first column is "unlimited", but only with Internet Explorer.

    Internet Explorer:

    http://www.pictureupload.de/pictures...8152342_IE.JPG

    Firefox:

    http://www.pictureupload.de/pictures...8151831_FF.JPG

    And here is my code:

    Code:
        var checkColumn = new xg.CheckColumn({
               header: 'Allow?',
               sortable: true,
               dataIndex: 'Level',
               width: 60
        });
    
        var griduser = new xg.GridPanel({
            id: 'griduser',
            title: 'Benutzer',
            store: UserStore,
            width: 200,
            border: false,
            columns: [
                {header: "ID", width: 10, sortable: true, hidden: true, dataIndex: 'ID'},
                {header: "Name", width: 200, sortable: true, dataIndex: 'Name'},
                {header: "Team", width: 80, sortable: true, dataIndex: 'Gruppe'},
                checkColumn
            ],
            plugins: checkColumn,
            view: new xg.GroupingView({
                forceFit: true,
                groupTextTpl: '{text} ({[values.rs.length]})' 
            }),
            listeners:{
                cellclick: function(grid, rowIndex, columnIndex, e){
                    var record = grid.getStore().getAt(rowIndex);
                    var fieldName = grid.getColumnModel().getDataIndex(0);
                    var data = record.get(fieldName);
                    adminuser(data);
                }
            }
        });
    
        var compPanel = new Ext.Panel({
            id: 'comppanel',
            title: 'Computer'
        });
    
        var window = new Ext.Window({
            id: 'window',
            title: 'xxxxx',
            minWidth: 360,
            minHeight: 500,
            width: 360,
            height: 500,
            resizable: true,
            layout: 'accordion',
            plain: true,
            closable: true,
            x: 20,
            y: 30,
            items: [griduser, compPanel],
                bbar: [
                    'Suche: ', ' ',
                    new Ext.app.SearchField({
                        id: 'searchfield',
                        store: UserStore
                    })
                ]
        });
    I hope someone can help me? I ve already changed the 10000px in the ext-all.css and searched the forum, but none of the suggested fixes could help me. If I set forceFit to false, it is correctly rendered in IE, but it won't fit if I am gonna resize the window.

    Thanks in advance!
    Last edited by mystix; 23 Sep 2008 at 7:04 AM. Reason: moved to 2.x Help from Open Discussion

  2. #2
    Ext User
    Join Date
    Jul 2007
    Posts
    3,128
    Vote Rating
    1
    devnull is an unknown quantity at this point

      0  

    Default


    What does the grid's parent layout look like? (in an Ext.Window I assume?)

  3. #3
    Ext User
    Join Date
    Aug 2008
    Posts
    13
    Vote Rating
    0
    melfice is on a distinguished road

      0  

    Default


    What do you mean with "parent layout look"? The grid is an item of the Ext.Window, that's right!

  4. #4
    Ext User
    Join Date
    Aug 2008
    Posts
    5
    Vote Rating
    0
    Schenck is on a distinguished road

      0  

    Default


    Hi, I have got the same Problem and I fixed it with
    forceFit: false

    after this it works fine in IE.

    Greets Schenck

  5. #5
    Ext User
    Join Date
    Aug 2008
    Posts
    13
    Vote Rating
    0
    melfice is on a distinguished road

      0  

    Default


    Yeah, I mentioned it before, but the then the next problem will occur. After resizing the window, the columns wont change their width. Is there any solution for this?

    Regards melfice

  6. #6
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    91
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    You need to make sure that the size of the grid is maintained by the window layout.

    You should post your code of the window config.

    ps. If the grid is the only item in the window then you can simply add layout:'fit' to the window config (and remove the width from the grid, because it isn't needed then).

  7. #7
    Ext User
    Join Date
    Aug 2008
    Posts
    13
    Vote Rating
    0
    melfice is on a distinguished road

      0  

    Default


    Thanks so far for your help!

    Ok, I removed the width of the gridPanel.

    And isn't this my window config code?

    Code:
        var window = new Ext.Window({
            id: 'window',
            title: 'xxxxx',
            minWidth: 360,
            minHeight: 500,
            width: 360,
            height: 500,
            resizable: true,
            layout: 'accordion',
            plain: true,
            closable: true,
            x: 20,
            y: 30,
            items: [griduser, compPanel],
                bbar: [
                    'Suche: ', ' ',
                    new Ext.app.SearchField({
                        id: 'searchfield',
                        store: UserStore
                    })
                ]
        });
    The window isn't configured anywhere else imho.

    And the gridPanel won't be the only item in the window, so I need the accordion layout!

  8. #8
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    91
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    Accordion layout can have some annoying side-effects with sizing.
    Couldn't you do the same with a border layout (put the grid in the center region and the panel in a collapsible south region)?

  9. #9
    Ext User
    Join Date
    Aug 2008
    Posts
    13
    Vote Rating
    0
    melfice is on a distinguished road

      0  

    Default


    Thanks for your fast reply!

    Ok I tried it with the border layout, but then my second Panel in the window will stay at bottom, when I collapse the first. Thats why I wanted to use the accordion layout.

  10. #10
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    91
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    I assume this is a classic 'grid with detail' layout (where the detail can optionally be hidden)?

    That is why I suggested that you set the grid to center region and the detail panel to collapsible south region.

Thread Participants: 3