Example 1: sweet alert 2 do action on confirm
Swal.fire({
title: 'Do you want to save the changes?',
showDenyButton: true, showCancelButton: true,
confirmButtonText: `Save`,
denyButtonText: `Don't save`,
}).then((result) => {
if (result.isConfirmed) {
Swal.fire('Saved!', '', 'success')
} else if (result.isDenied) {
Swal.fire('Changes are not saved', '', 'info')
}
});
Example 2: swal change confirm button class
Swal.fire({
title: 'example text',
buttonsStyling: false,
customClass: {
confirmButton: 'example-class'
}
})
Example 3: sweet alert add custom button
$(document).on('click', '.SwalBtn1', function() {
console.log('Button 1');
swal.clickConfirm();
});
$(document).on('click', '.SwalBtn2', function() {
console.log('Button 2');
swal.clickConfirm();
});
$('#ShowBtn').click(function(){
swal({
title: 'Title',
html: "Some Text" +
"<br>" +
'<button type="button" role="button" tabindex="0" class="SwalBtn1 customSwalBtn">' + 'Button1' + '</button>' +
'<button type="button" role="button" tabindex="0" class="SwalBtn2 customSwalBtn">' + 'Button2' + '</button>',
showCancelButton: false,
showConfirmButton: false
});
});
Example 4: sweetalert confirm box
swal({ title: "Are you sure?", text: "Once deleted, you will not be able to recover this imaginary file!", icon: "warning", buttons: true, dangerMode: true,}).then((willDelete) => { if (willDelete) { swal("Poof! Your imaginary file has been deleted!", { icon: "success", }); } else { swal("Your imaginary file is safe!"); }});
Example 5: sweetalert2
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
Example 6: swal confirm
swal({
title: "Are you sure?",
text: "You will not be able to recover this imaginary file!",
type: "warning",
showCancelButton: true,
confirmButtonColor: '#DD6B55',
confirmButtonText: 'Yes, I am sure!',
cancelButtonText: "No, cancel it!"
}).then(
function () { },
function () { return false; });