I'm trying to implement the Sweet Alert in my application and I'd like that by clicking Yes the button would be type loading until processing
I'm trying to follow this tutorial, but I still do not understand:
So here's my code:
$('.btn-remover').on('click', function(){
remover(1);
})
function remover( id ) {
swal({
text: 'Deseja realmente excluir o item '+id,
buttons: {
cancel: {
text: 'Não',
closeModal: true,
visible: true
},
confirm: {
text: 'Sim'
}
},
icon: "warning",
closeOnClickOutside: false,
}).then( (willDelete) => {
swal({
title: 'Please Wait..!',
text: 'Is working..',
allowOutsideClick: false,
allowEscapeKey: false,
allowEnterKey: false,
showLoaderOnConfirm: true,
onOpen: () => {
swal.showLoading()
}
})
if(willDelete){
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN' : $('meta[name="csrf-token"]').attr('content')
}
})
$.ajax({
url: 'url',
dataType: 'json',
type: 'post',
data: {
id: id
}
}).then((data) => {
pagingTable()
swal.stopLoading();
swal({
text: data.message,
icon: 'success'
})
}).fail((data) => {
swal.stopLoading();
swal({
text: data.responseJSON.message,
icon: 'error'
})
})
}else{
swal.close()
}
} )
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<a href="#" class="btn btn-remover" data-id="1">Remover</a>I would like it to look something like this:
