HX-Redirect: how to do a full redirect and avoid hx-target?

Consider this common form validation pattern:

1. I have a form that gets posted to the server.
2. If form validation occurs, just return the <form> content with error messages+user input and insert into the DOM.
3. If form is valid, perform whatever server-side action and then redirect to another page.

So I have a form like this:

<form class="rounded border bg-white mb-3"
      id="article-form"
      method="post"
      hx-post="/post-url/"
      hx-target="this">

The server returns the form HTML correctly with errors. However, when sending a redirect, the whole page is loaded into the form tag (given the hx-target).

To get around this I’ve tried setting the HX-Redirect and HX-Refresh headers in the response, but neither appear to have any effect: the content is still loaded into the hx-target element.

Is there an idiomatic way to do this with htmx, or do I just have to go back to full server-side page reloads for validation?

[1cg]

Two thoughts here:

1. If you send an HX-Redirect header, you want just a normal 200 response code because the redirect is going to be done server side.

2. It sounds like you want to replace a different target on success. Would the OOB swap mechanism be acceptable for this? https://htmx.org/docs/#oob_swaps

We could add a new header, HX-Retarget that allows you to change the target of the response via the header. Worth considering.

[bencroker]

Yes, it should.