I have 3 combo box's. When you click the first box the second box needs to update showing the relevant data. I select the first combo the second box updates perfectly. However if i try the same steps again the second box doesn't stop loading ( see image )
Here is the code from my view
{
xtype: 'combobox',
name: 'Clients',
id: 'clients',
displayField: 'Name',
store: 'Clients',
queryMode: 'local',
mode: 'local',
valueField: 'Id',
fieldLabel: 'Clients'
},{
xtype: 'combobox',
name: 'Projects',
id: 'projects',
displayField: 'Name',
editable: false,
store: 'Projects',
queryMode: 'local',
mode: 'local',
valueField: 'Id',
fieldLabel: 'Projects'
}
and from my controller
stores: ['Projects', 'Clients', 'Jobs'],
init: function () {
this.control({
'#clients': {
change: this.onClientSelect
},
'processlist button[action=copy]': {
click: this.onCopyPart
},
'#processColourContainer #processColourGrid': {
edit: this.onPurchaseOrderColourUpdate
}
});
},
onLaunch: function () {
var clients = this.getClientsStore();
clients.load();
},
onClientSelect: function (selModel, selection) {
var projects = this.getProjectsStore();
projects.load({
url: '/Projects/Read/?clientId=' + selection,
scope: this
});
},
Known bug:
http://www.sencha.com/forum/showthread.php?153490-Combo-Box-Store-Loading
Adding this should sort it out:
store.on('load', function (store, records, successful, options) {
if (successful && Ext.typeOf(combo.getPicker().loadMask) !== "boolean") {
combo.getPicker().loadMask.hide();
}
});