How to avoid validation for hidden fields in Extjs 4
How I would not check for hidden fields when the container has hidden: true
but not the actual field
I made the following override as an attempt to fix this problem, it worked, tried my best not to interfere with the normal checkout flow to keep the code looking good.
/* traverse up and look for a hidden Parent/Ancestor */
Ext.override(Ext.form.field.Base, {
isParentHidden: function () {
return this.up('[hidden=true]');
}
});
/* override isValid basic method to consider skipValidateWhenHidden property,
when skipValidateWhenHidden is set to true code should check if the elementor it Parent/Ancestors is hidden */
Ext.override(Ext.form.field.Base, {
isValid: function () {
var me = this,
disabled = me.disabled,
isHidden = me.isHidden(),
skipValidateWhenHidden = !!me.skipValidateWhenHidden,
validate = me.forceValidation || !disabled,
isValid = validate ? me.validateValue(me.processRawValue(me.getRawValue())) : disabled;
if (isValid || !skipValidateWhenHidden) {
return isValid;
}
if (skipValidateWhenHidden) {
isHidden = isHidden ? true : me.isParentHidden();
if (isHidden) {
return skipValidateWhenHidden;
}
}
return isValid;
}
});
and ultimately I will be able to do the following, which sets the property to true on the field, so if it is not visible to the user, it will pass the test
{
itemId: 'City',
cls: 'AddressCity',
xtype: 'textfield',
emptyText: emptyCityText,
skipValidateWhenHidden: true,
},
source to share
It may be easier to disable fields when the parent is hidden. As the documentation says , disabled fields are automatically considered valid.
You can then handle this for each view and inject listeners on the parent show / hide events to enable / disable form fields in it.
source to share
I had the same situation and did this:
if (!me.isFormValid(form)) {
...
}
isFormValid: function (form) {
var isValid = true,
fields = form.getForm().getFields();
fields.each(function (field) {
if (!field.isHidden || (field.isHidden && !field.isHidden())) {
isValid = isValid && field.isValid();
}
});
return isValid;
},
source to share