combobox value didn't set correctly

[karantir]

Hi!
I'm using the following code to load data to my combobox



...
var access_data = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: "/ajax.php?module=admin.sitemap&action=get_accesses&id_module=" + this.getAt(0).data.id_module
}),
reader: new Ext.data.ArrayReader({},['id_access','accessName']),
remoteSort: false
});
access_data.load();
...
var accesses = new Ext.form.ComboBox({
fieldLabel: 'Access',
hiddenName: 'id_access',
value: this.getAt(0).data.id_access,
triggerAction: 'all',
emptyText: '',
store: access_data,
valueField: 'id_access',
displayField: 'accessName',
mode: 'local',
width: item_props_field_w,
disabled: (this.getAt(0).data.id_module == 0) ? true : false
});
...
item_props.fieldset(
...
accesses,
...
);
...


And everything goes fine except of that initial value of accesses combo sets in numeric valueField instead of string disaplayField, although the corresponding record exists (see screenshot) and even selected when the list dropped down.

This strange behavior isn't observing when I'm assigning dropdown options from the local store like this


var modules = new Ext.form.ComboBox({
fieldLabel: 'Module',
hiddenName: 'id_module',
value: this.getAt(0).data.id_module,
triggerAction: 'all',
emptyText: '',
store: new Ext.data.SimpleStore({
fields: ['id_module', 'moduleName'],
data: Ext.admin.modules
}),
valueField:'id_module',
displayField:'moduleName',
mode: 'local',
width: item_props_field_w
});


I've already tested dozens of ways to make this field work correctly but all of it leads to the same result... :(

Here is the full code for this form if somebody find it necessary:


Cthulhu.showProgress('Loading content...');
btns.remove.enable();
btns.save.enable();
item_data = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url: '/ajax.php?module=admin.sitemap&action=get&id_item=' + item.id}),
reader: new Ext.data.JsonReader({},['id_access','id_module','moduleParams','itemName','urlPart','state']),
remoteSort: false
});
item_props = new Ext.form.Form({
id: 'item_props',
labelAlign: 'left',
labelWidth: item_props_label_w,
buttonAlign: 'right',
url: '/ajax.php?module=admin.sitemap&action=save&id_item=' + item.id
});
item_data.on('load', function() {
var access_data = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: "/ajax.php?module=admin.sitemap&action=get_accesses&id_module=" + this.getAt(0).data.id_module
}),
reader: new Ext.data.ArrayReader({},['id_access','accessName']),
remoteSort: false
});
access_data.load();
var itemName = new Ext.form.TextField({
fieldLabel: 'Item name',
name: 'itemName',
value: this.getAt(0).data.itemName,
width: item_props_field_w
});
var urlPart = new Ext.form.TextField({
fieldLabel: 'URL part',
name: 'urlPart',
value: this.getAt(0).data.urlPart,
width: item_props_field_w
});
var states = new Ext.form.ComboBox({
fieldLabel: 'State',
hiddenName: 'state',
value: this.getAt(0).data.state,
triggerAction: 'all',
store: new Ext.data.SimpleStore({
fields: ['num', 'state'],
data: Ext.admin.states
}),
valueField:'num',
displayField:'state',
mode: 'local',
width: item_props_field_w
});
var modules = new Ext.form.ComboBox({
fieldLabel: 'Module',
hiddenName: 'id_module',
value: this.getAt(0).data.id_module,
triggerAction: 'all',
emptyText: '',
store: new Ext.data.SimpleStore({
fields: ['id_module', 'moduleName'],
data: Ext.admin.modules
}),
valueField:'id_module',
displayField:'moduleName',
mode: 'local',
width: item_props_field_w
});
var accesses = new Ext.form.ComboBox({
fieldLabel: 'Access',
hiddenName: 'id_access',
value: this.getAt(0).data.id_access,
triggerAction: 'all',
emptyText: '',
store: access_data,
valueField:'id_access',
displayField:'accessName',
mode: 'local',
width: item_props_field_w,
disabled: (this.getAt(0).data.id_module == 0) ? true : false
});
var moduleParams = new Ext.form.TextField({
fieldLabel: 'Module parameters',
name: 'moduleParams',
value: this.getAt(0).data.moduleParams,
width: item_props_field_w,
disabled: (this.getAt(0).data.id_module == 0) ? true : false
});
item_props.fieldset(
{legend: "Item properties"},
itemName,
urlPart,
states,
modules,
accesses,
moduleParams
);
item_props.render('cbody');
modules.on('select', function(){
Cthulhu.showProgress('Waiting for server...');
ajax = new Ext.data.Connection;
ajax.request({
url: '/ajax.php',
method: 'POST',
params: {
module: 'admin.sitemap',
action: 'get_accesses',
id_module: modules.getValue()
},
callback: function(options, success, response) {
if (success) {
data = eval('(' + response.responseText + ')');
if (data) accesses.store.loadData(data);
if (accesses.disabled) accesses.enable();
if (moduleParams.disabled) moduleParams.enable();
}
Cthulhu.hideProgress();
}
});
});
Cthulhu.hideProgress();
});
item_props.on({
actioncomplete: function(form, action){
if(action.type == 'submit'){
stree.getNodeById(current_item.id).setText(form.findField('itemName').getValue());
Cthulhu.hideProgress();
}
}
});
item_data.load();

[devnull]

I've experienced similar problems and never really found a correct solution. I think the problem lies with the combobox being rendered before the store finishes loading. I've been able to implement workarounds by using the store's load event to set the combobox value though.