Here's a piece of code that allows you not to ever think about the combobox's store state when dealing with setValue() with a local or remote combobox. Calling setValue multiple times on a remote combobox will work as well, it will automatically load the value from the server first (by sending the value as the [valueField] param to the server) and then select it. Calling setValue() on a remote combobox will also make sure that any active requests are cancelled before proceeding. In addition, the callbacks won't execute if the combobox has been destroyed.
Code:
Ext.override(Ext.form.ComboBox, {
setValue: Ext.form.ComboBox.prototype.setValue.createInterceptor(function(v, loadRecord) {
loadRecord = !(loadRecord === false);
if (!this.isDestroyed && loadRecord) {
var cbo = this,
store = cbo.store,
isLocalMode = cbo.mode === 'local',
vField = cbo.valueField,
callback = function(rec, options, success) {
if (success && cbo.store) {
cbo.setValue(v, false);
}
};
if (isLocalMode && !Ext.isDefined(store.totalLength)) {
store.on({
'load': callback,
scope: cbo,
single: true
});
if (!store.autoLoad) {
store.load();
}
return false;
}
else if (!isLocalMode) {
var rec = cbo.findRecord(vField, v);
if (!rec) {
var readRequest = store.proxy.activeRequest.read,
params = {};
if (readRequest) {
readRequest.conn.abort();
}
params[vField] = v;
store.load({
callback: callback,
params: params
});
return false;
}
}
}
})
});