gohtmxgo-fiber

Go Fiber and HTMX - HX-Trigger header is changed to Hx-Trigger, which is not what HTMX is listening for


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?

Picture showing the header name as Hx-Trigger


Solution

  • 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.