I have a very simple to-do app with a form and a list of to-dos, built in Fiber and HTMX. When the user adds a new to-do via the form, I want HTMX to refresh the list of todos. I know I can use hx-swap-oob
, but then I'm returning the new To-Do as part of my form partial, and that doesn't feel correct.
According to the HTMX Docs, I can set an HX-Trigger
response header.
So, in Fiber, this is what the code for my POST /todos
handler looks like:
func (h *TodoHandler) Create(c *fiber.Ctx) error {
// do stuff to create the todo and persist it...
c.Context().Response.Header.Set("HX-Trigger", "newTodo")
return adaptor.HTTPHandler(templ.Handler(partial.TodoForm(&td)))(c)
}
This seems to work, but the header is being set to Hx-Trigger
, not HX-Trigger
. How can I force Fiber (or the underlying fasthttp) to respect the casing for the header name?
The header casing issue turned out to be a red-herring. I was missing an HTMX trigger in my UI code.
I had <div hx-trigger="newTodo from:body">
but what I needed was <div hx-trigger="newTodo from:body" hx-get="/todo-list">
, so it knew where to fetch the list of To-Dos.