1. #1
    Sencha User
    Join Date
    Oct 2010
    Location
    Vitoria-Gasteiz (Spain)
    Posts
    54
    Vote Rating
    0
    lucia_mgv is on a distinguished road

      0  

    Default Combobox in an anchor form

    Combobox in an anchor form


    Hi,

    I am rendering a viewport with an anchor form panel. In this form I have a textfield and a combobox, both of them with anchor:'100%'.
    It is rendering correctly, but if I expand de combo's menu, when resizing the window, the combo's menu doesn't resize the width. I mean, it stays with the same fixed width instead of recalculate as the combobox does.

    This is the code:
    Code:
    Ext.onReady(function() {
        
           Ext.regModel('State', {
            fields: [
                {type: 'string', name: 'abbr'},
                {type: 'string', name: 'name'},
                {type: 'string', name: 'slogan'}
            ]
        });
    
        var states = [
            {"abbr":"AL","name":"Alabama","slogan":"The Heart of Dixie"},
            {"abbr":"AK","name":"Alaska","slogan":"The Land of the Midnight Sun"},
            {"abbr":"AZ","name":"Arizona","slogan":"The Grand Canyon State"},
            {"abbr":"AR","name":"Arkansas","slogan":"The Natural State"}
        ];
    
        var store = new Ext.data.Store({
            model: 'State',
            data: states
        });
    
        var simpleCombo = new Ext.form.ComboBox({
            fieldLabel: 'Select a single state',
            displayField: 'name',
            width: 500,
            labelWidth: 130,
            store: store,
            queryMode: 'local',
            typeAhead: true,
            anchor:'100%' 
        });
        
        
        var form = Ext.create('Ext.form.FormPanel', {
            bodyBorder: 0,
            defaultType: 'textfield',
            padding:'30 30 30 30',
            items: [{
                fieldLabel: 'Send To',
                name: 'to',
                anchor:'100%'  
            },
            simpleCombo,
            {
                xtype: 'textarea',
                hideLabel: true,
                name: 'msg',
                anchor: '100% -47' 
            }]
        });
        
        var viewport = Ext.create('Ext.container.Viewport', {
            renderTo:document.body,
            layout:'fit',
            items:[form]
        });
    
    });
    And I attach an screenshot.

    In ExtJS3 it worked perfectly. Maybe I miss some config option...

    Thanks for your help,

    Lucia
    Attached Images

Similar Threads

  1. Replies: 2
    Last Post: 8 Jan 2011, 10:22 AM
  2. Replies: 6
    Last Post: 8 Apr 2010, 4:44 PM
  3. Combobox with Anchor 100% doesn't scale
    By timo.nuros in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 22 Oct 2007, 7:30 PM
  4. [2.0a1][DUPLICATE] ComboBox Anchor:100% broken in IE
    By fancellu in forum Ext 2.x: Bugs
    Replies: 1
    Last Post: 4 Oct 2007, 6:02 AM