Forms and validation

Validation is where hypermedia gets pleasantly boring. There's no client-side schema, no error-state store: the server validates (as it must anyway — the client can always lie), and on failure it re-renders the form partial with the errors inside it. The user's input and the messages come back as one fragment.

The trick is the target. Point the form at itself with hx-swap="outerHTML", so whatever comes back replaces the whole form:

{{define "todo-form"}}
<form hx-post="/todos" hx-swap="outerHTML">
  <input name="title" value="{{.Values.title}}">
  {{with .Errors.title}}<p class="error">{{.}}</p>{{end}}
  <button>Add</button>
</form>
{{end}}

(No hx-target means "the element that made the request" — the form.) The handler has one branch per outcome:

mux.HandleFunc("POST /todos", func(w http.ResponseWriter, r *http.Request) {
    title := strings.TrimSpace(r.FormValue("title"))
    if title == "" {
        w.WriteHeader(http.StatusUnprocessableEntity) // 422
        tmpl.ExecuteTemplate(w, "todo-form", FormData{
            Values: map[string]string{"title": r.FormValue("title")},
            Errors: map[string]string{"title": "Title is required"},
        })
        return
    }
    todo := store.Add(title)
    tmpl.ExecuteTemplate(w, "todo-form", FormData{}) // a fresh, empty form
    tmpl.ExecuteTemplate(w, "todo-item-oob", todo)   // plus the new row, out of band
})

On failure: same form back, now carrying the user's values and inline errors, with a 422 so logs and tests can tell rejection from success. On success: a fresh form replaces the old one — and the new row rides along out of band: a fragment marked hx-swap-oob="beforeend:#list" gets routed to #list no matter what the main swap targets. One response, two destinations.

The challenge models the handler's two branches: validate, then return either the form-with-errors (422) or the fresh form plus the out-of-band row (200).

Next: every one of these POSTs hits the database — time to configure SQLite so concurrent handlers don't collide.