jaredpalmer / jaredpalmer/formik

Validate on field registration

Open
#2,000 1 comment 0 reactions 1 assignee Claimed by @jaredpalmer View on GitHub
Component: Field Focus: Validation stale Type: Feature Request
Dominant language
TypeScript
Stars
34.3k
Forks
2.8k
PR merge metrics
No merged PRs in 30d

Description

## 🚀 Feature request

### Current Behavior

The following events do not cause validation to occur:
- Adding a field (_useField_ first call i.e. _registerField_)
- Change to field level validation (useField validate argument change)
- Removal of a field (_useField_ remove call i.e. _unregisterField_)

### Desired Behavior

The following would occur on addition/change:
- Trigger changed/added field-level validation
- Update formik-wide valid state

The following would occur on removal:
- Update formik-wide valid state

### Suggested Solution

Add an effect to the useField hook to trigger a validation call when triggered/removed

OR

Add validateForm call to register/unregister field functions.

### Who does this impact? Who is this for?

- Anyone using field level validation

### Describe alternatives you've considered

Proxying `useField` hook to do this manually - currently having to use this solution.

```tsx
export const makeUseField = >() => <
K extends keyof S & string = Exclude
>(
{ name, validate }: UseFieldArgs
) => {
const { validateForm, isValid } = useFormikContext();

const formikUseFieldArgs = useMemo(
() => ({ name, validate }),
[validate],
);

useEffect(() => {
validateForm();
return () => validateForm();
}, [validate, validateForm]);

return useField(formikUseFieldArgs) as [FieldInputProps, FieldMetaProps];
};
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.