ngSweetAlert vertical scroll bar disappear when clicking on cancel button

Question

I'm using ngSweetAlert in my project.

It works perfectly except when I added the showCancelButton: true property.

Indeed, for example :

SweetAlert.swal({
   title: "Are you sure?",
   text: "Your will not be able to recover this imaginary file!",
   type: "warning",
   showCancelButton: true,
   confirmButtonColor: "#DD6B55",
   confirmButtonText: "Yes, delete it!",
   closeOnConfirm: false}, 
function(){ 
   //do something if "Yes, delete it!" button is clicked
});

When it's called, the sweet alert window appear and at this moment, the vertical scrollbar is disabled, no problem until now.

The user has two choice in this case :

Click on button "Yes, delete it!" : the sweet alert disappear and my vertical scroll bar returned back.
Click on button "Cancel" : so the sweet alert disappear but my problem is the fact that my vertical scroll bar is still disable, which should not be the case !

One possible solution is to add overflow-y: auto; css property on my <body> html tag but the problem is that the vertical scroll bar is not disable while sweet alert is displayed. (Which is not ideally what I want...)

Does someone has already this issue before ?

score 1 · Accepted Answer · answered May 24 '16 at 09:03

I solved my problem, you just need to add :

closeOnCancel: true

so now, it looks like this :

SweetAlert.swal({
   title: "Are you sure?",
   text: "Your will not be able to recover this imaginary file!",
   type: "warning",
   showCancelButton: true,
   confirmButtonColor: "#DD6B55",
   confirmButtonText: "Yes, delete it!",
   closeOnConfirm: false,
   closeOnCancel: true}, 
function(){ 
   //do something if "Yes, delete it!" button is clicked
});

ngSweetAlert vertical scroll bar disappear when clicking on cancel button

1 Answers1