Menu
I'm trying to validate the email field before closing the SweetAlert but for some reason the SweetAlert is closing after catching the error:
Swal.fire({
title: title,
html: template,
preConfirm: function (email) {
email = '';
return new Promise(function (resolve, reject) {
setTimeout(function () {
if (email === '') {
alert("err");
reject('err')
} else {
resolve()
}
}, 1000)
}).catch(err => alert("error catched"))
},
});
What can I do to prevent the SweetAlert modal from closing when the error is caught?
Thanks
394
Here's an example that's fully functional (for solving your specific problem):
<html>
<body>
<div class="showDialogButton">Show dialog</div>
<script src="https://code.jquery.com/jquery-3.4.1.js"
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
<script type="text/javascript">
$(() => {
const title = "Hi"
const template = `<b>hello</b> world`
$(".showDialogButton").click(() => {
Swal.fire({
title: title,
html: template,
preConfirm: function (email) {
email = '';
return new Promise(function (resolve, reject) {
setTimeout(function () {
if (email === '') {
reject('Email is empty!')
} else {
resolve()
}
}, 1000)
}).catch(err => {
alert(`error: ${err}`)
return false
})
},
});
})
})
</script>
</body>
</html>
The default behavior is to close the dialog. In order to override that, you have to return false from the function that you're passing in to .catch.
From https://sweetalert2.github.io/#configuration
Argument: preConfirm
Default value: null
Description: Function to execute before confirm, may be async (Promise-returning) or sync. Returned (or resolved) value can be:
falseto prevent a popup from closing- anything else to pass that value as the
result.valueofSwal.fire()undefinedto keep the defaultresult.value
150
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
