ExtJS combobox does not show values

Question

I have a combobox editor for a grid column. It is editable too. The store for the combobox has autoLoad config, set to false implying that when the user clicks on the combobox, the store is loaded. It works fine if I don't type in anything in the combobox and click on it. However, if I type something first in the combobox, then click outside and then again click on the combobox to load the dropdown, it doesn't render at all. It just shows loading and then doesn't display the drop down.

It's a very weird problem as I have similar comboboxes for other columns as well which work fine but they are not editable.

I have been breaking my head with this for many days but no solution! Can somebody please help?

    editor: {
        xtype: 'combobox',
        store: contextDropDownStoreforFactGrid,
        queryMode: 'remote',
        id: 'fact_contextId',
        displayField:'context',
        valueField: 'context',
        vtype: 'alphanum',
        listeners: {
                    beforeQuery: function(query) {
                        contextDropDownStoreforFactGrid.removeAll();
                        contextDropDownStoreforFactGrid.load();
                    }
                }
            }

The store is

    var contextDropDownStoreforFactGrid = Ext.create('Ext.data.Store', {
    fields: [{name:'context',type:'string'}],
     proxy: {
         type: 'ajax',
         url: context + '/FcmServlet',
         extraParams: {
             'action': 'getContextDropDownValues'
         },
         reader: {
             type: 'json'
         }
     },
     autoLoad: false
});

The json is:

    [{"context":"Uplift"},{"context":"QTCUplift"},{"context":"MSRP"},{"context":"Khanij"}]

vajrakumar vajrakumar · Accepted Answer · 2013-10-09T10:10:16

I dont know why you are trying to load store in before quesry, I mean :

listeners: {
            beforeQuery: function(query) {
                contextDropDownStoreforFactGrid.removeAll();
                contextDropDownStoreforFactGrid.load();
            }
        }
    }

If you remove this above piece of code what happens ? Do you think it will not load store ? I don't think, just as usual it should load. I guess problem is you are removing records before load, which is not at all necessary

contextDropDownStoreforFactGrid.removeAll();

Because as per API

beforequery : ( Object queryEvent ) Fires before all queries are processed

I don't think before query event need to be handled explicitly.

ExtJS combobox does not show values

3 Answers