ExtJS--typeAhead for combobox with queryMode "local"--cant query for substring

Question

I'm using Ext 4.1.1

I have a combobox with typeAhead enabled for queryMode:"local". It works fine as long as you only query the prefix of the displayField. But nothing happens when you query for a substring in that display field.

{
            xtype:"combo",
            fieldLabel:"Country",
            name:"COUNTRY",
            itemId:"countryFilterFld",
            labelPad:5,
            typeAhead:true
            queryMode:"local",             
            valueField:"ID",                
            displayField:"LABEL",
                store:store
}

For Example, one of the LABEL's is "United States". If I start to type in "United", "United States" gets filtered. But if I type "States", nothing happens at all.

I also tried listening to the comboboxes "change" event then get the value and filter the combobox store but the change event does not even get fired.

listeners: {           
  change: function(cbo_) {
    var store = cbo_.getStore();                
    store.clearFilter();                
      store.filter({
        property: 'LABEL',
        anyMatch: true,
        value   : cbo_.getValue()
    })
  }
},

I setup a breakpoint in the change event handler but the event is never fired, even after I am no longer focused on that field.

Answer 1

Use anyMatch on your combo:

Configure as true to allow matching of the typed characters at any position in the valueField's value.

For example:

{
        xtype: "combo",
        fieldLabel: "Country",
        name: "COUNTRY",
        itemId: "countryFilterFld",
        labelPad: 5,
        typeAhead: true
        queryMode: "local",             
        valueField: "ID",                
        displayField: "LABEL",
        store: store,
        anyMatch: true
}