CODEWITHSUNDEEP
javascriptjqueryhtmlsweetalert
caot
caot

Reputation: 3328

swal on mouse click

The following example ONE is from https://lipis.github.io/bootstrap-sweetalert/. While clicking anywhere outside of the alert box, the alert box won't go away. That's what I expected.

swal({
  title: "Are you sure?",
  text: "You will not be able to recover this imaginary file!",
  type: "warning",
  showCancelButton: true,
  confirmButtonClass: "btn-danger",
  confirmButtonText: "Yes, delete it!",
  cancelButtonText: "No, cancel plx!",
  closeOnConfirm: false,
  closeOnCancel: false
},
function(isConfirm) {
  if (isConfirm) {
    swal("Deleted!", "Your imaginary file has been deleted.", "success");
  } else {
    swal("Cancelled", "Your imaginary file is safe :)", "error");
  }
});

Another example TWO is from https://sweetalert2.github.io/. It behaved in another way. While clicking anywhere outside of the alert box, the alert box is gone. 

Swal.fire({
  title: '<strong>HTML <u>example</u></strong>',
  type: 'info',
  html:
    'You can use <b>bold text</b>, ' +
    '<a href="//sweetalert2.github.io">links</a> ' +
    'and other HTML tags',
  showCloseButton: true,
  showCancelButton: true,
  focusConfirm: false,
  confirmButtonText:
    '<i class="fa fa-thumbs-up"></i> Great!',
  confirmButtonAriaLabel: 'Thumbs up, great!',
  cancelButtonText:
    '<i class="fa fa-thumbs-down"></i>',
  cancelButtonAriaLabel: 'Thumbs down'
})

In my code base as the follows, it behaved the same way as the example TWO. While clicking anywhere outside of the alert box, the alert box is gone.

How to fix it so that the alert box won't be gone while clicking anywhere outside of the alert box? What could be the version of my sweetalert ?

swal({
    title: "Message:",
    text: "Here is some detailed message",
    type: "warning",
    buttons: {
        to_refresh: {
            text: "Refresh the current view",
            visible: true,
            closeModal: true
        },
        to_close: {
            text: "Back to Main Menu!",
            visible: true,
            closeModal: true
        },
    },
}).then(value => {
    if (value === 'to_refresh') {
        // window.location.href = window.location.href;
        location.reload(true);
    } else {
        window.location.href = "to some other link"
    }
});

Upvotes: 0

Views: 694

Answers (1)

Wilco
Wilco

Reputation: 384

depending on which Swal version you are using.

For SweetAlert 2:

allowOutsideClick: false

for SweetAlert (version 1):

closeOnClickOutside: false

Upvotes: 2

Related Questions