Closing a modal window

Hello everyone! I’m trying to make a modal window when you click on your profile image, that shows options like “Profile”, “Logout” etc (like in facebook). I managed to open the window, but how do I close it when the user clicks somewhere else?

Bildschirmfoto 2022-10-06 um 02.34.25

Hi,

You could assign the visibility of this window to a true/false page variable and set up logic to close it. For instance, a click to other UI elements.

Thanks for your answer Kirill! But Isn’t there a more elegant way to close a modal instead of adding the “close open modals” function in every ui element? I thought it’s a common case that many people faced already

I kinda solved the problem now using two nested containers. I have one big container, that covers the whole page, and on top of that the modal window container. when you open the modal window, the modal container becomes visible. then, when you click anywhere else, you will click the big modal container and it will turn its visibility off

Bildschirmfoto 2022-10-08 um 15.42.04

1 Like