extjs: combobox typeahead does not work with querymode : remote

Question

I have an extjs combobox whose queryMode is set to remote. I also want the typeAhead feature in it. But typeahead doenst work in this case. The store reloads to the original data even after typing some text in the combobox.

Here is my code:

var queryStore = Ext.create('Ext.data.Store', {
//autoLoad: true,
model: 'UserQuery',
proxy: {
    type: 'ajax',
    url: 'queryBuilder_getQueryList',
    extraParams: {
        tableId: this.title
    },
    reader: {
        type: 'json'
    }
},
listeners: {
    load: function () {
        var combo = Ext.getCmp('cmbQueryList');
        var lst = this.last();
        if (lst)combo.setValue(lst.data);
    }
}

});


var queryCombo = new Ext.form.ComboBox({
    width: 200,
    id: 'cmbQueryList',
    store: queryStore,
    valueField: 'queryID',
    displayField: 'queryName',
    typeAhead: true,
    forceSelection: true,
    emptyText: 'Select Query...',
    queryMode: 'remote',
    triggerAction: 'query',
    selectOnFocus: true,
    allowBlank: false,
    editable: true
 });

Please suggest how do I get typeAhead and querymode remote to work together.

Answer 1

this code corking for me .I guess your store property autoload is true so when you going to select the combobox its going to server and reload the data. please remove the property of store auto load true. Then its working.

new Ext.form.ComboBox({  

    fieldLabel:'Apps',
    displayField: 'name',
    valueField: 'id',
    typeAhead: true,
    listWidth : 345,
    store: myStore(),
    forceSelection: true,
    triggerAction: 'all',
    mode:'remote',
    maxLength: 50,
    editable: false,
    anchor : '90%',
    selectOnFocus:true

 }),

Answer 2

This following code worked at me. We have to specific the both mode and queryMode to local.

var queryCombo = new Ext.form.ComboBox({
    width: 200,
    id: 'cmbQueryList',
    store: queryStore,
    valueField: 'queryID',
    displayField: 'queryName',
    emptyText: 'Select Query...',
    queryMode: 'local',
    mode: 'local'
 });