Forms & Validation

Implement form-centric Hotwire workflows with Turbo Frames and Stimulus.

Core Workflow

1. Identify the form flow: create/edit, inline edit, typeahead, modal form, or external controls.
2. Wrap the form interaction scope in a Turbo Frame when validation errors must rerender in place.
3. Return 422 for validation failures and 303 for successful redirects.
4. Handle post-submit behavior with turbo:submit-end only when Turbo defaults are insufficient.
5. Preserve user context during rerenders (focus/caret/selection).

Guardrails

• Keep one source of truth for input state; avoid duplicate controls across frame and non-frame DOM.
• Use the HTML form attribute for controls rendered outside the target <form> hierarchy.
• Avoid firing submit logic on every keystroke without debounce/throttle.
• Keep post-submit behavior explicit when form responses update only a frame.