PDA

View Full Version : [4.0.1] and [4.0.2] Combo box store lost when tabbing off of editable



sam_hewitt
9 Jun 2011, 12:46 PM
When using a combo box that is editable=true and forceSelction=true, if the item is selected by just typing in the combobox and you tab off the combo box, when the store is viewed, it has only one record, the selected record.
This is not the case when you use the mouse to select a record from each combo box.

In the below example, watching the console log you can see the logged store has only one item, instead of five. The same is true for defining a second similar store and not sharing it between the combo boxes.


Ext.define('SharedStore', {
extend: 'Ext.data.Store',
fields:['id','Name'],
sorters: [
{ property: 'Name', direction: 'ASC' }
],
data:[
{id:1,Name:'e'},
{id:2,Name:'d'},
{id:3,Name:'c'},
{id:4,Name:'b'},
{id:5,Name:'a'}
]
});
Ext.onReady(function(){
var storeOne = new SharedStore();
var storeTwo = new SharedStore();
Ext.create('Ext.form.Panel',{
renderTo:Ext.getBody(),
items:[
{
xtype:'combo',
name:'One',
store:storeOne,
emptyText:'-- Select --',
displayField: 'Name',
valueField: 'id',
allowBlank: false,
forceSelection: true,
queryMode:'local',
labelWidth:60,
width:200,
validator:function(value){
var otherField = this.up('form').getForm().findField('Two'),
otherValue = otherField.getRawValue();
otherField.clearInvalid();
if(value == otherValue)
{
otherField.markInvalid('Cannot have duplicate values.');
return 'Cannot have duplicate values.';

}
return true;
}
},
{
xtype:'combo',
name:'Two',
store:storeTwo,
emptyText:'-- Select --',
displayField: 'Name',
valueField: 'id',
allowBlank: false,
forceSelection: true,
queryMode:'local',
labelWidth:60,
width:200,
validator:function(value){
var otherField = this.up('form').getForm().findField('One'),
otherValue = otherField.getRawValue();
otherField.clearInvalid();
if(value == otherValue)
{
otherField.markInvalid('Cannot have duplicate values.');
return 'Cannot have duplicate values.';

}
return true;
}
},
{
xtype:'button',
text:'Submit',
handler:function(button, e){
var form = button.up('form').getForm(),
oneField = form.findField('One'),
twoField = form.findField('Two'),
obj = { }, array = [];
array.push(oneField.getRawValue());
array.push(twoField.getRawValue());
obj[oneField.getRawValue()] = oneField.getValue();
obj[twoField.getRawValue()] = twoField.getValue();
array = Ext.Array.sort(array);
console.log(storeOne);
console.log(storeTwo);
}
}
]
});
});