I have a form and I want to trigger an alert (using sweetalert) on submit:
<form id="verbale" class="verbale" action="editor_conferma.php" method="post">
...
<input id="go" type="submit" name="go" value="go" class="swa-confirm">
</form>
<script>
$(document).on("submit", ".swa-confirm", function (e) {
e.preventDefault();
var $myForm = $('.verbale');
if (!$myForm[0].checkValidity()) {
$myForm[0].reportValidity()
} else {
swal({
title: "Are you sure?",
text: "Did you check?",
type: "warning",
showCancelButton: true,
confirmButtonText: "Yes, Submit!",
}).then(function (result) {
$myForm.submit();
});
}
});
</script>
The sweetalert dialog appears but when I confirm, the form is not passed on and submit does not seem to work.
Any hints?
2
Answers
Initially you gave the submit button the ID/Name of
submit
– that will block the submissionYou need to assign the submit to the FORM and NOT use the jQuery submit since it triggers the sweetalert again
sweetalert.js.org, has
buttons
Lastly I test that Yes, Submit is clicked
Note: If you use
required
, there is no need to test the validity unless you have turned standard validation off and you want to handle the validation yourselfSWAL2.11
I know that this question has already been answered, and you would like to use jQuery and sweetalert, but I couldn’t help it. Here is an example of a native dialog box and how it can be used in connection with the submit event.