useFormContext

(formId?: string) => FormContextValue

Returns information about the specified form.

FormContextValue

fieldErrors

Record<string, string>

Contains all the validation errors in the form. The keys of the object are the field names and values are the error messages. If the form contains nested data, the field errors are not nested -- the keys of the object will be the same as the name passed to the input itself. (e.g. todos[1].title)

isValid

boolean

Whether or not the form valid.

clearError

(...fieldNames: string[]) => void

Clear the errors from all the specified fields.

clearAllErrors

() => void

Clears all the errors in the form.

validateField

(fieldName: string) => Promise<string | null>

Performs validation on the specified field and populates fieldErrors if there is an error. Also returns the error message if there is an error.

This helper will also update errors for other fields in the form depending on the touched state of those fields.

• If another field no longer has an error, it will be cleared automatically.
• If another field's error has changed, it will be updated automatically.
• If another field has a new error, it will only add the error if the field has been touched or the form has already been submitted unsuccessfully.

validate

() => ValidationResult

Validates the whole form and updates fieldErrors. Also returns the ValidationResult object. This is the same object you get from validator.validate when validating on the server.

action

string | undefined

The value of the action prop passed to the ValidatedForm component. If no action prop is passed, this will be undefined.

subaction

string | undefined

The value of the subaction prop passed to the ValidatedForm component. If no subaction prop is passed, this will be undefined.

isSubmitting

boolean

Whether or not the form is currently submitting.

hasBeenSubmitted

boolean

Whether or not a submit has been attempted. This will be true after the first submit attempt, even if the form is invalid. This resets when the form resets.

defaultValues

Record<string, any>

The default values of the ValidatedForm component. In cases where the user has javascript disabled, this can sometimes be something other than what is passed into the ValidatedForm directly.

touchedFields

Record<string, boolean>

Contains all the touched fields. The keys of the object are the field names and values are whether or not the field has been touched. If a field has not been touched at all, the value will be undefined. If you set touched to false manually, then the value will be false.

setFieldTouched

(fieldName: string, touched: boolean) => void

Manually set the touched state of the specified field.

reset

() => void

Resets the form, setting values back to default and clearing all errors and touched states..

Note: This same behavior can be achieved by calling reset on the form element itself or by clicking a button with type="reset"

submit

() => void

Submits the form, running all validations first.

Note: This is equivalent to clicking a button element with type="submit" or calling formElement.submit().

getValues

() => FormData

Returns the current form values as a FormData object.