Extjs Combobox: forceSelection false on combobox not working

Question

I have created a combobox and attached a array to store. What i wanted is that use can select from the list OR can type custom text as well. I searched that can be achieved through forceSelection = false, i read the docs that and found out that forceSelection is by default false and as i'm using sencha architect so i can't explicitly set the config. So below is the config which i have done. But as soon as i press tab or enter the typed text in combobox no longer exist.

{
xtype: 'fieldcontainer',                                    
id: 'internetmessager',
autoDestroy: false,
layout: {
    align: 'stretch',
    type: 'hbox'
},
items: [
    {
        xtype: 'combobox',
        flex: 1,
        margin: '0 10 0 0',
        name: 'label',
        autoSelect: false,
        queryMode: 'local',
        store: [
            'Home',
            'Work',
            'Personal'
        ],
        typeAhead: true
    },
    {
        xtype: 'textfield',
        flex: 2,
        name: 'value',
        emptyText: 'IM'
    }
]
}

Thanks, Ali Abbas

Answer 1

I think it's a bug in sencha Architect 2.2.2, that the default value of 'forceSelection' is true but docs says it's false. And architect don't provide you way to make 'forceSelection' false b/c it's build by assuming that 'forceSelection' property is false. That what i comeup with correct me if i'm wrong. The workaround which i did, used the 'Process Confg' in arhitect config panel. which add the processLabel function

{
    xtype: 'fieldcontainer',
    id: 'internetmessager',
    autoDestroy: false,
    layout: {
        align: 'stretch',
        type: 'hbox'
    },
    items: [
        me.processLabel({
            xtype: 'combobox',
            flex: 1,
            margin: '0 10 0 0',
            name: 'label',
            store: [
                'Home',
                'Work',
                'Personal'
            ],
            valueField: 'text'
        }),
        {
            xtype: 'textfield',
            flex: 2,
            name: 'value',
            emptyText: 'IM'
        }
    ]
}

And in processLabel function i made forceSelection property false explicitly.

 processLabel: function(config) {        
    config.forceSelection = false;
    return config;
}

Answer 2

[edit] oh man... I'm sorry... After I reread your question againg, I realized you're using Sencha Architect [/edit]

I'm not sure, if I understood you correctly... What I did: Write into combobox or select a value from its store. When leaving (blur-listener) the combobox, the actual value is set into textfield. btw: itemId's would be nice to use (imho)

    items: [
{
    xtype: 'fieldcontainer',
    id: 'internetmessager',
    autoDestroy: false,
    layout: {
        align: 'stretch',
        type: 'hbox'
    },
    items: [
        {
            xtype: 'combobox',
            flex: 1,
            margin: '0 10 0 0',
            name: 'label',
            autoSelect: false,
            queryMode: 'local',
            store: [
                'Home',
                'Work',
                'Personal'
            ],
            typeAhead: true,
            listeners: {
                blur: function (combo) {
                    Ext.ComponentQuery.query('[name=value]')[0].setValue(combo.getValue());
                }
            }
        },
        {
            xtype: 'textfield',
            flex: 2,
            name: 'value',
            emptyText: 'IM'
        }
    ]
}