Results 1 to 3 of 3

Thread: Anchor Layout + AutoScroll

  1. #1

    Default Anchor Layout + AutoScroll

    Hi,
    I'm trying to use this configs in combination without success.
    The example bellow illustrates the issue:

    The page have a Panel with autoScroll, anchor layout and a grid as an item.
    The GridPanel is loaded by clicking the "Load Grid" button. Because there are to many records, the grid becomes Higher than the panel and a vertical scroll bar is correctly displayed. However, an horizoltal scroll bar is incorrectly displayed as shown in the image.
    The two commented lines workaround this problem, but I dont think i should be calling doLayout every time the panel's content is modified.

    Is this the expected behavior of the anchor layout? It's not wrong? What should i do?

    Code:
                Ext.onReady(function()
                {
                    var data = [],
                        MAX_SIZE = 100;
                    
                    for (var i=0; i<=MAX_SIZE; i++) {
                        data.push({
                            id    : i,
                            name: 'value' + ' ' + i.toString() 
                        })
                    }
                    
                    var store = new Ext.data.JsonStore({
                        proxy    : new Ext.data.MemoryProxy(data),
                        fields    : [
                            {name: 'id', type: 'int'},
                            {name: 'name', type: 'string'}
                        ]
                    });
                    
                    var grid = new Ext.grid.GridPanel({
                        store        : store,
                        anchor        : '0',
                        autoHeight    : true,
                        border        : false,
                        viewConfig    : {
                            forceFit    : true,
                            scrollOffset: 0
                        },
                        columns    : [{
                            dataIndex    : 'name',
                            header        : 'Name'
                        }]
                    });
                    
                    new Ext.Viewport({
                        layout    : 'fit',
                        items    : {
                            xtype        : 'panel',
                            autoScroll    : true,
                            layout        : 'anchor',
                            items        : grid,
                            tbar        : [{
                                text: 'Load Store',
                                handler: function() {
                                    store.load({
    //                                    scope: grid.ownerCt,
    //                                    callback: grid.ownerCt.doLayout
                                    });
                            }]
                        }
                    });
                 });
    Attached Images Attached Images
    Attached Files Attached Files

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379

    Default

    Try anchor: '100%' on your grid.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  3. #3

    Default

    Changing anchor from "0" to "100%" didn't worked. There is a difference between using one or the other?

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •