Disable button while submitting

[aeropagz]

Is there a way to disable a button while a request is still inflight to prevent multiple requests to be fired?

[Telroshan]

If your goal is to prevent multiple requests at the same time, hx-sync could be a good fit

If you really wish to toggle the disabled attribute on the button, you could bind some custom JS to htmx events, such as the htmx:beforeSend and htmx:afterRequest events

[matiboy]

You can also use the loading-states extension

<div hx-ext="loading-states">

<button hx-get="/demo" hx-target="#outcome" data-loading-disable>
  Click me</button>
<div id="outcome"></div>
</div>

See it in action in this codepen

[dmenisdev]

A bit late but you can try the hx-disabled-elt see HTMX docu: https://htmx.org/attributes/hx-disabled-elt/ .