1. #1
    Sencha User
    Join Date
    Dec 2011
    Posts
    13
    Vote Rating
    0
    plgagnon is on a distinguished road

      0  

    Default Ext.menu.Menu layout error with maxHeight and docked item top

    Ext.menu.Menu layout error with maxHeight and docked item top


    Hey,

    I have been trying to make a button with a menu and a docked textfield on top. Heres my code :

    Code:
    Ext.define('myapp.view.TestMenu', {
        extend: 'Ext.button.Button',
        alias: 'widget.myapp.testmenu',
    
    
        text : 'text',
        ui: 'yellow-text',
        id : 'test',
        margin:'5 5 5 5',
        textAlign: 'left',
    
    
        menu : Ext.create('Ext.menu.Menu', {
            maxHeight:150,
            minWidth:400,
            border: false,
            dockedItems: [{
                xtype: 'panel',
                dock: 'top',
                items: [
                {
                    xtype: 'container', 
                    layout: 'fit',
                    items : [{
                        margin:'5 5 5 5',
                        xtype: 'textfield',
                        name: 'textfield'
                    }]
                }
                ]
            }
            ],
            
            items: [
                {text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'},{text: 'Fake Item'}
            ]
        })
                        
    });
    Quite simple. Yet everytime I click it, I get this layout error :

    Code:
    [E] Layout run failed
    How can I acheive this? Im going to have lots of items and want to keep a textfield to filter them on top while its scrollable... Need help.

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,915
    Vote Rating
    630
    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

      1  

    Default


    Try adding shrinkWrapDock: true to the menu config.

    Also note that you're over-nesting. You can just dock the top text field directly, no need to wrap it a panel and then a container.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  3. #3
    Sencha User
    Join Date
    Dec 2011
    Posts
    13
    Vote Rating
    0
    plgagnon is on a distinguished road

      0  

    Default


    Thanks that worked!

    For the overnesting, I'll try to remove them but I have problem using fit directly on my docked right menu. Also without panel, background around that menu was transparent..

Thread Participants: 1