ComboBoxes are a very handy control to use when creating a form, giving the user a convenient list of values you want them to choose from. However, these lists grow very long and the convenience starts to shrink as they are forced to trawl through a lengthy list of options.
Ext JS has provided us with the ability to allow comboboxes to autocomplete and select an option as we type, so we can find the correct value faster. This recipe will demonstrate how to set up this functionality.
Our first step is to create an
Ext.data.Store
, which we will bind to our combobox to give it its list of values. Our example will display a list of car manufacturers:var carManufacturersStore = Ext.create('Ext.data.Store', { fields: ['name'], data: [{ name: 'Aston Martin' }, { name: 'Bentley' }, { name: 'Daimler' }, { name: 'Jaguar' }, { name: 'Lagonda' }, { name: 'Land Rover' }, { ...