PDA

View Full Version : Combobox problem with Ext 5.1



cbazin
26 Feb 2015, 10:05 AM
I had a problem with the combobox and Ext 5.1 (this example worked as expected with Ext 5.0.1)



{
xtype: 'combobox',
store: Mymodule.GENDER_CHOICES, // (store)
name: 'gender',
queryMode: 'local',
fieldLabel: translate('Gender'),
displayField: 'name',
valueField: 'value',
forceSelection: true,
bind: {
value: '{mainRecord.gender}'
},
}


Mymodule.GENDER_CHOICES is a simple store created like this :



Ext.create('Ext.data.Store', {
"fields": [
"value",
"name"
],
"data": [
{
"name": translate("male"),
"value": 1
},
{
"name": translate("female"),
"value": 2
},
]
})


The field gender is defined like this :


{
"name": "gender",
"type": "integer",
"defaultValue": 1,
"validators": [
{
"type": "presence"
},


{
"list": [
1,
2
],
"type": "inclusion"
}
]
},


And... it doesn't work.

The combobox does the validation on the rawValue of the choice ("female" or "male"). I expected the validation to be performed on the "value" of the field (1 or 2).


The only way I found to make the combobox work with Ext5.1 is to overload the isValid method in the field definition :


{
xtype: 'combobox',
store: Mymodule.GENDER_CHOICES, // (store)
//....
isValid: function() {
var me = this,
disabled = me.disabled,
validate = me.forceValidation || !disabled;

return validate ? me.validateValue(me.getValue()) : disabled;
}
}


Is that normal?
Is that what we want?
Did I do something wrong?

joel.watson
28 Feb 2015, 9:13 AM
Hi--

I'm not sure what the issue is. When I put together a Fiddle using your code, it seems to behave the same in 5.0.1 as in 5.1.0. Can you take a look?

Thanks
Joel

iv8

chanand
19 Jul 2015, 10:57 PM
Use `modelValidation: true` to reproduce (also in extjs 6!!!):

https://fiddle.sencha.com/#fiddle/qoj

My workaround is an override of `isValid` & `publishValue`:




Ext.define('MyApp.form.field.ComboBox', {
override: 'Ext.form.field.ComboBox',

isValid: function () {
var me = this,
disabled = me.disabled,
validate = me.forceValidation || !disabled;

return validate ? me.validateValue(me.getValue()) : disabled;
},

publishValue: function() {
var me = this;
if (me.rendered && !me.getErrors(me.getValue()).length) {
me.publishState('value', me.getValue());
}
}
});

lsdriscoll
6 May 2016, 3:14 AM
Thanks for the patch @chanand