Thank you for all your effort. I found the answer: Use htmx:confirm
instead of hx-on:submit
:
<form id="assessment" name="assessment"
hx-post="/assessment-result.php"
hx-target=".questions_list"
hx-swap="outerHTML transition:true swap:200ms"
hx-trigger="submit"
hx-include=".questions_list input[type=radio]:checked">
...
</form>
document.body.addEventListener('htmx:confirm', (event) => {
event.preventDefault();
if( invalid ) {
swal('Invalid form');
}else{
// https://htmx.org/events/#htmx:confirm
// true to skip the built-in window.confirm()
event.detail.issueRequest(true);
}
});