ComboBox ArrayStore dynamic load in 4.2 (working example)

[jkyoutsey]

http://jsfiddle.net/jkyoutsey/xSenT/

I can't seem to get an ArrayStore to load. I'm trying to build a combobox with no data to start with, then, as the user types a query will load a new data set into the store.

I'm seeing a bug where the dropdown will not every show (well, it does but it's just one or two pixels high). It never shows the new data.

Hints???

[jay@moduscreate.com]

that's because you're mixing array store and jsonstore..

Here are two examples:
ARRAY STORE

var emptyData = [];
var data = [
    [ "display1", "value1" ],
    [ "display2", "value2" ]
];

var store = Ext.create('Ext.data.ArrayStore', {
    storeId  : 'theStore',
    autoLoad : true,
    //model : 'myModel',
    //autoDestroy : true,
    data     : emptyData,
    fields   : [
        'display',
        'value'
    ]
});

Ext.create('Ext.container.Container', {
    renderTo : Ext.getBody(),
    width    : 250,
    padding  : 10,
    layout   : {
        type  : 'vbox',
        align : 'stretch'
    },
    items    : [
        {
            xtype           : 'combobox',
            id              : 'searchInput',
            fieldLabel      : 'Search:',
            enableKeyEvents : true,
            submitEmptyText : false,
            emptyText       : 'search...',
            valueField      : 'value',
            displayField    : 'display',
            width           : '100%',
            store           : store
        },
        {
            xtype   : 'button',
            text    : 'Add store',
            handler : function() {

                store.loadData(data, false);

            }
        }
    ]
});

JSON STORE

var emptyData = { "data" : []};
var data = {
    "data" : [
        { "display" : "display1", "value" : "value1" },
        { "display" : "display2", "value" : "value2" }
    ]
};

var store = Ext.create('Ext.data.JsonStore', {
    storeId  : 'theStore',
    autoLoad : true,
    //model : 'myModel',
    //autoDestroy : true,
    data     : emptyData,
    root     : 'data',
    fields   : ['display', 'value']
});

Ext.create('Ext.container.Container', {
    renderTo : Ext.getBody(),
    width    : 250,
    padding  : 10,
    layout   : {
        type  : 'vbox',
        align : 'stretch'
    },
    items    : [
        {
            xtype           : 'combobox',
            id              : 'searchInput',
            fieldLabel      : 'Search:',
            enableKeyEvents : true,
            submitEmptyText : false,
            queryMode       : 'local',
            emptyText       : 'search...',
            valueField      : 'value',
            displayField    : 'display',
            width           : '100%',
            store           : store
        },
        {
            xtype   : 'button',
            text    : 'Add store',
            handler : function() {
                store.loadData(data.data, false);
            }
        }
    ]
});

[jkyoutsey]

Thanks! I guess I should stop coding on Friday afternoons!

[jkyoutsey]

Ignore this post. Testing login issue.

[jkyoutsey]

Ignore this post. Testing login issue with forum (IE9 same machine with issue)

[jkyoutsey]

Ignore this post. Firefox