Form methods

To retrieve the values of your form or to make changes to the form, Formisch provides you with several methods. These apply either to the entire form or to individual fields.

Reading values

To retrieve values from your form, you can use:

• getInput: Get the current value of a specific field
• getErrors: Get error messages for a specific field
• getAllErrors: Get all error messages across the entire form

Formisch uses Qwik's signals internally which means that reading values with these methods is reactive. When the form state changes, any component or computation that uses these methods will automatically update to reflect the new state.

Setting values

To manually update form values or errors, use:

• setInput: Manually update the value of a specific field
• setErrors: Manually set error messages for a specific field

Form control

To control the form programmatically, use:

• handleSubmit: Create a submit event handler that validates the form and calls your handler on success
• reset: Reset the form to its initial state or update initial values
• validate: Manually trigger validation for the entire form or specific fields
• submit: Programmatically trigger form submission
• focus: Focus on a specific field

Array operations

For working with field arrays, Formisch provides:

• insert: Insert a new item into a field array
• remove: Remove an item from a field array
• move: Move an item to a different position in a field array
• swap: Swap two items in a field array
• replace: Replace an item in a field array

API design

All methods in Formisch follow a consistent API pattern: the first parameter is always the form store, and the second parameter (if necessary) is always a config object. This design makes the API flexible and consistent across all methods. Once you understand this pattern, you basically understand the entire API design.

Here are some examples:

// Get the value of a field
const emailInput = getInput(loginForm, { path: ['email'] });

// Reset the form with new initial values
reset(loginForm, { initialInput: { email: '', password: '' } });

// Move an item in a field array
move(loginForm, { path: ['items'], from: 0, to: 3 });

API reference

You can find detailed documentation for each method in our API reference.