Hwc Forms Validation

Reach for this when you're wiring up Turbo Frame form submissions and need validation errors to render inline without breaking user focus. It covers the full lifecycle: create/edit flows, inline editing, typeahead search with validation, modal forms, and the external form controls pattern. The guardrails are solid reminders about keeping one source of truth and using the HTML form attribute when controls live outside the form DOM. References are dated and selective, so you load exactly what you need for inline edits, modals, or typeahead. If your form problem bleeds into navigation history or real-time updates, it explicitly hands off to neighbor skills.

skills.sh installs: 230
GitHub stars: 153
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add thehotwireclub/hotwire_club-skills --skill hwc-forms-validation --agent claude-code

Installs into .claude/skills of the current project.

Files

Forms & Validation

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

Core Workflow

Identify the form flow: create/edit, inline edit, typeahead, modal form, or external controls.
Wrap the form interaction scope in a Turbo Frame when validation errors must rerender in place.
Return 422 for validation failures and 303 for successful redirects.
Handle post-submit behavior with turbo:submit-end only when Turbo defaults are insufficient.
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.