Resetting validation errors
I have a large form of over 100 fields. Large sections of it can be added/removed so there is a need for clearing out validation errors if a section that has errors is removed.
Otherwise the user could be unable to submit because there are validation errors in fields they can't see.
Currently I'm going about it this way:
If a section is removed I loop through the fields in that section:
- Setting the field values to an empty string
- re validating the fields to clear the validation errors.
And this does the job. The form becomes valid and can be submitted.
However, this obviously blanks the fields and if the user changes their mind and readds a section they removed, their entered values are gone.
Any ideas on how to clear out validation errors without clearing the values? Is that even desirable?
I've played with resetting the meta, but it gets messy because errorMap and field values get out of sync.
Thank you for reading this far, greatly appreciated! ❤️
1 Reply
deep-jadeOP•8mo ago
So I'm attempting this, instead of clearing all fields that could fail validation, I'm checking if they have any errors in meta and only clearing those fields.
const fieldsToUpdate = [
"propertyAddressCity",
... etc
];
for (const field of fieldsToUpdate) {
const fieldMeta = form.getFieldMeta(field);
if (fieldMeta && fieldMeta.errors.length > 0) {
form.setFieldValue(field as keyof IntakeFormModel, "");
form.validateField(field as keyof IntakeFormModel, "change");
}
}
This works pretty well, but I do find that after running this, I need to make another change somewhere in the form to have it revalidate and set the whole form to valid.