PDA

View Full Version : ComboBox does not update.



xjscrafter
10 Dec 2013, 5:20 PM
In the following code, the first time user selects a value from the first combo, the second combo is not populated. The second time you select a value in the first combo, the second combo is properly populated.

This is a simplified example but if we can solve this, the problem in my larger code will likely be solved as well.


Ext.onReady(function() {
var level1Store = Ext.create('Ext.data.Store', {
fields: [{ name: 'Level1name' }, { name: 'Level2names' }],
data: [
{ "Level1name": "level1 value1",
"Level2names": [
{ "Level2name": "level1 value1_1"},
{ "Level2name": "level1 value1_2"},
{ "Level2name": "level1 value1_3"}
]
},
{ "Level1name": "level1 value2",
"Level2names": [
{ "Level2name": "level1 value2_1"},
{ "Level2name": "level1 value2_2"},
{ "Level2name": "level1 value2_3"}
]
},
{ "Level1name": "level1 value3",
"Level2names": [
{ "Level2name": "level1 value3_1"},
{ "Level2name": "level1 value3_2"},
{ "Level2name": "level1 value3_3"}
]
}
]
});
var level2Store = Ext.create('Ext.data.Store', {
fields: [{ name: 'Level2name' }],
proxy: {
type: 'memory',
reader: {
type: 'json'
}
}
});


Ext.create('Ext.panel.Panel', {
width: 500,
height: 500,
items: [{
xtype: 'combo',
id: 'combo1',
fieldLabel: 'Level1',
store: level1Store,
displayField: 'Level1name',
valueField: 'Level1name',
listeners: {
change: function() {
var combobox = Ext.getCmp('combo1');
var v = combobox.getValue();
var record = combobox.findRecord(combobox.valueField || combobox.displayField, v);
var index = combobox.store.indexOf(record);


var dataSource = level1Store.getAt(index).get("Level2names");
level2Store.removeAll();
level2Store.add(dataSource);
level2Store.sync();
}
}
}, {
xtype: 'combo',
fieldLabel: 'Level2',
store: level2Store,
displayField: 'Level2name',
valueField: 'Level2name'
}],


renderTo: Ext.getBody()
});
});

xjscrafter
10 Dec 2013, 5:36 PM
I had to add queryMode: 'local' to my combobox definition.

slsb02
10 Dec 2013, 10:49 PM
this work for me:


queryMode: 'local',
lastQuery: '',

xjscrafter
11 Dec 2013, 9:02 AM
queryMode: 'local' seems to do the trick. Maybe lastQuery: '' will also be necessary in some circumstances. Thanks for your reply.