Document form reset pattern

[alexpetros]

<form hx-put="/user" hx-on::after-request="this.reset()">
...
</form>

Oh that does look nice. For what it’s worth: I was not able to figure this out as a succinct alternative. Most suggestions on the internet are to either send a whole new form over the wire or to write more js than that. For example:

https://stackoverflow.com/questions/70043237/how-do-we-make-a-htmx-response-trigger-a-form-reset

If you choose to reject this PR on the grounds that the above is sufficient, it might be worth calling that out in the docs somewhere as this seems like a common pattern. It was the very first dilemma I ran into when trying out HTMX.

Originally posted by @jakespracher in #1636 (comment)

[alexpetros]

This should probably have it's own example in the examples section, like #1670

[heinrichgh]

Coming from #1636 after needing the same thing, I would like to place emphasis on the "after successful request".

It can still be achieved with the existing syntax, its just slightly more verbose:

<form hx-put="/user" hx-on::after-request=" if(event.detail.successful) this.reset()">
...
</form>

I believe the majority use case would be to reset a form only after a successful request, therefore documenting the example as such might be beneficial.

[tedyoung]

I would've liked to have seen this as an example within the hx-on reference, or at least a link. Just spent some time coming to the same solution using the event.detail as mentioned above.