FieldStatus Plugin
Tracks the validation status of each field in real time and fires a callback whenever the form's overall validity changes — useful for enabling or disabling a submit button as the user fills the form.
Options
| Option | Type | Default | Description |
|---|---|---|---|
enabled | boolean | true | Enable or disable the plugin |
onStatusChanged | (areFieldsValid: boolean) => void | undefined | Called after any field status change |
Public Methods
| Method | Returns | Description |
|---|---|---|
getStatuses() | Map<string, FieldValidationStatus> | Returns the current status of every field. Returns an empty map when the plugin is disabled. |
areFieldsValid() | boolean | Returns true when all fields are "Valid" or "NotValidated". Returns false if any field is "Invalid" or "Validating". |
Field Status Values
| Value | Meaning |
|---|---|
"NotValidated" | Field has not been validated yet (initial state) |
"Validating" | Async validators are running |
"Valid" | All validators passed |
"Invalid" | At least one validator failed |
Playground
Fill in the fields and watch the submit button enable automatically when all fields are valid.
Notes
areFieldsValid()returnstruewhen all fields are"NotValidated"(initial state) — this means the submit button starts enabled by default. If you want it disabled until the user attempts submission, initialise the button as disabled and only enable it after the first validation.onStatusChangedis called multiple times during validation (once when validation starts, once when it finishes). Always use the latest value.- Access
getStatuses()to build per-field UI indicators (e.g., coloured dots in a multi-step progress bar).