Validate inputs and forms

Learn how to validate forms and input components.

Many input components support validation rules. These rules enforce certain requirements on user inputs, such as minimum or maximum length. Configure validation settings in the Interaction section of the Inspector.

The validation rules available depend on the type of component you're using. The following lists include common rules:

Number Inputs

Validation rules common across number input components:

Rule	Description
Allow null	Whether to allow a null value. If true, the input's cleared state is null instead of 0.
Minimum	The minimum value to accept.
Maximum	The maximum value to accept.
Required	Indicates that a value must be provided for this input.

Text Inputs

Validation rules common across text input components:

Rule	Description
Pattern	A limitation on the type of string to accept. Options are Email, Regex, or URL.
Min length	The minimum number of characters to accept.
Max length	The maximum number of characters to accept.
Required	Indicates that a value must be provided for this input.

File Inputs

Validation rules common across file input components:

Rule	Description
Min files	The minimum number of files that can be uploaded.
Max files	The maximum number of files that can be uploaded.
Min size	The minimum size of uploaded files with optional file size units. Without units, measured in bytes.
Max size	The maximum size of uploaded files with optional file size units. Without units, measured in bytes.
Required	Indicates that a value must be provided for this component.

Date and Time Inputs

Validation rules common across date and time input components:

Rule	Description
Min date or time	The minimum allowed date or time.
Max date or time	The maximum allowed date or time.
Required	Indicates that a value must be provided for this input.

Special Inputs

Validation rules common across special input components:

Rule	Description
Required	Indicates that a value must be provided for this input.

These lists are not comprehensive. Check the Validation rules of your component for the full list.

Apply custom validation rules

You can also create a Custom rule. Custom rules support any JavaScript expression that evaluates to a truthy value.

Optionally, set this field to evaluate to a string, which the component displays as an error message.

For example, you could create a custom rule with the following value: {{ new Date().getDay() === 1 ? 'This input is invalid on Mondays' : '' }}. This rule triggers an error message to display on Mondays. No error message is displayed on all other days.

Custom rule

Validate form submissions

Forms can check the validation status of inputs—enable Validate inputs on submit in the Interaction section of the Inspector. Each input component supports several validation options. Validation for a selected input is configured in the Validation section of the Inspector.

If any single input fails validation, the form fails validation.

For JSON Schema Form components, you define validation rules in the JSON schema. You can also enable automatic validation by enabling Live validation in the Inspector.

You can also modify input properties of JSON Schema Form components by updating the type field. This can be useful if fields need to accept null values or you need to modify your form to more closely match your data.