OutSystems 10 Web - How to prevent modal to be closing when click the background?

OutSystems 10 Web - How to prevent modal to be closing when click the background?

  

Dear OutSystems experts,

I'm developing OutSystems application that UX design two different kind of popup on screen. I'm using Ajax and conditional rendering with if to open the popup same when closing it through the button ("Cancel" or "Save" and and works fine as those are calling the "Screen Action".

I have issue that when I click the modal background then also closes, but it does not use ajax the clean up the modal away from the page and that causes undesired behavior.



How to prevent modal to be closing when click the background or catch the closing at Screen Action?

Hi Sampsa,

The Modal has a DIV that "hides" the screen below, and this DIV has a onclick event that closes the modal.

You can use JavaScript to remove this listener, or you can clone the SilkUI module and rewrite the modal to not have this feature and use your own modal.

Cheers.

Hi Nagesh,

Besides the solution Eduardo provided, you can also use a Popup (which does not close if you click beside it) with Popup_Editor (remember to hide the close button, since you want the parent screen to be notified if the popup closes). It would require you to make a new screen though, which might not fit your requirements.

Solution

Hi 

Thanks for answers. My solution was kind as Eduardo said, using JavaScript:

From Browsers console I realized that 

$('.ModalBackground').unbind('click')

Does fix the issue, but when I did apply that after ToggleModal() with RunAsJavaScript it did not work. 

Now the solution is:

Syntax Editor Code Snippet

setTimeout(function(){ $('.ModalBackground').unbind('click'); }, 5);

I realize that upper is kind of hack, but it did do the job.

Solution