Removing the validation when Redux-Form Field is disabled

Question

I am using Redux form v6.5.0 and having a requirement of Removing the validation for any Field when the disabled props is passed as true.

I wrote a custom logic to disable the validation inside render() of custom field component, but looks like updateSyncErrors() is not getting called on the form even after updating the values manually. Because of this, syncErrors object is persisting the field validation error.

    if (field.disabled) {
        field.meta.invalid = false;
        field.meta.error = undefined;
        field.meta.valid = true;
    }

Can we have some straight forward - simple & better approach which tackles this requirement and fixes this issue?

Answer 1

I faced the same situation, I wanted to disable or enable fields based on API response and according to that, I had to enable and disable validations also. I was able to do that in the below way

Input Field (select field)

              <Field
                formItemLayout={layout}
                name="configType"
                validate={
                  !(
                    response &&
                    response.data &&
                    response.data.isEnabled
                  )
                    ? [required]
                    : undefined
                }
                component={ASelectField}
                placeholder="configType"
                disabled={
                    response &&
                    response.data &&
                    response.data.isEnabled
                }
                onChange={(e) => changeconfigSelectFields(e)}
                onBlur={(e) => {
                  e.preventDefault();
                }}
              >
                {Object.keys(fields.data).map(
                    (obj) => {
                      return <Option key={obj}>{obj}</Option>;
                    }
                  )}
              </Field>

top of the class I Add below method

const required = value => value ? undefined : 'Required'