Hello, All

First of, I would like to say how wonderful I find ExtJS. I find it a very well designed and intuitive API. Up to now, I have been able to figure things out from the docs and examples. Keep up the good work.

My question is very simple, though after trying different things for a while, I haven't been able to figure out how to get it working.

I would like to create a grid of configuration settings, in the form:

[NAME, VALUE]
foo, <combo-box>,
bar, <combo-box>,
....

I have been able to create the grid fine, but the combo-box's values is what's giving me some trouble.


I tried many versions of an ArrayStore to pass to the EditorGridPanel widget. This is what it currently looks like:

Code:
// List of available saved filters.
var filterStore = new Ext.data.ArrayStore({
    fields: ['filterName', 'filterValue'],
    data : [
        ['version',  
         [{name: 'foo', value: 'bar'},
          {name: 'foo2', value: 'bar2'}
         ]
        ],
        ['assigned', ['foo', 'bar']]
    ] 
});
The code for creating the grid panel is as follows. In the definition of function
_getFilters(filterStore), in creation of Ext.grid.EditorGridPanel, you can see the store being assigned.
Code:
var FilterPanel = function(savedFiltersMenu, filterStore)  {
    
    return {
        id:'filter-panel',
        region:'west',
        title:'Filter Tasks',
        split:true,
        width: '100%',
        minSize: 175,
        maxSize: 400,
        margins:'0 0 5 5',
        cmargins:'0 5 5 5',
        rootVisible:false,
        lines:false,
        autoScroll:true,
        collapseFirst:false,
        items: _getFilters(filterStore),
        tbar: [{
            text:'Apply',
            handler: this.showWindow,
            scope: this
        }, {
            id:'delete',
            text:'Reset',
            handler: function(){
                alert('clicked');
            },
            scope: this
        }, '->',  
            savedFiltersMenu, {
            text:'Save',
            scope: this
            }
        ]
    }
};

/************************************************************/

/**
 *  Get a grid of filters and filter values.
 */
function _getFilters(filterStore) {
    
    // Value editor widget.
    var combo = new Ext.form.ComboBox({
            typeAhead: false,
            triggerAction: 'all',
            lazyRender:true,
            listClass: 'x-combo-list-small'
    });

    // Grid column information.
    var cm = new Ext.grid.ColumnModel([{ 
            id:'filterName',
            header: 'Filter',
            dataIndex: 'filterName',
            width: 100,
            sortable: false
        },{
            id: 'filterValue',
            header: "Value",
            dataIndex: 'filterValue',
            width: 125,
            sortable: false,
            mode: 'local',
            editor: combo
        }
    ]);

    // create the editor grid
    var grid = new Ext.grid.EditorGridPanel({
            store: filterStore,
            height: 300,
            cm: cm,
            autoExpandColumn:'filterValue',
            frame:0,
            clicksToEdit:1
    });

    return grid;
}
Regards,

Vlad