<form hx-post="/example" hx-ext="disable-submit">
<button type="submit" class="hx-disable button-default">Save</button>
</form>
htmx.defineExtension('disable-submit', {
onEvent: function (name, evt, data) {
let elt = evt.detail.elt;
let result = elt.querySelectorAll(".hx-disable");
if (name === "htmx:beforeRequest") {
result.forEach(element => element.disabled = true);
if (elt.classList.contains("hx-disable")) elt.disabled = true;
} else if(name == "htmx:afterRequest") {
result.forEach(element => element.disabled = false);
if (elt.classList.contains("hx-disable")) elt.disabled = false;
}
}
});