I have a custom function triggered when a dropdown item is selected, which triggers a sweetalert2 popup. Here's the function:
function SwalPopup(ip, method) {
var methodmsg = method.charAt(0).toUpperCase() + method.slice(1);
swal.fire({
text: 'Are you sure you want to '+methodmsg+' ?',
type: "warning",
showCancelButton: true,
confirmButtonColor: "#3085d6",
confirmButtonText: 'Yes, '+methodmsg+'!',
cancelButtonColor: '#d33',
showCloseButton: true,
showLoaderOnConfirm: true,
preConfirm: function () {
return new Promise(function (resolve, reject) {
var ajaxCall = $.ajax({
url: 'wait.php',
type: 'GET',
dataType: 'json',
timeout: 5000
})
ajaxCall.done(function( response ){
resolve(response);
swal.fire({
type: 'success',
html: 'Component with IP: <?php echo $action_ip; ?>'+ip+' was '+methodmsg+' sucessfully!',
showCancelButton: false,
confirmButtonColor: '#3085d6',
confirmButtonText: 'Ok',
allowOutsideClick: false
});
});
ajaxCall.fail(function( jqXhr, textStatus, errorThrown ){
reject(errorThrown);
Swal.fire('Error! It was not possible to '+methodmsg+' component with IP: <?php echo $action_ip; ?>'+ip, 'Status: '+textStatus+' Error: '+errorThrown);
});
});
},
allowOutsideClick: false
});
}
My wait.php script includes a sleep(10) command and then returns true:
sleep(10);
echo json_encode(array(
'success' => true,
));
The Ajax call made to this wait.php file has a timeout of 5 seconds even though the script execution takes 10 seconds. During this time, the sweetalert popup shows a loading animation and a non-clickable cancel button. I'm looking to implement an abort function on this cancel button so that the Ajax request can be cancelled if it exceeds the defined time limit.
Is this behavior considered a bug?
Thank you