Prevent scrolling on page when i have my overlay modal is opened

Hello,

WeWeb modal will not do the job in my situation because i need to make it component, and when you make it component you cant trigger the modal from outside. Not with Execute component action or with Toggling Modal - Open variable.

So i am making my modal and everything ok except that when i open my modal i can scroll page in background but i dont want this. How to prevent scrolling only when my modal with overlay is opened?

Thank you in advance

Hi Zoran :waving_hand:

You can call a popup from an external source with our new popup system by adding an action called “Open Popup”

You can read more about it here:

Hope this helps

Hello,

Thank you for answer. I have read this and there is no solution there. Because when i made component from WeWeb modal, after that i can not trigger modal in workflow with Execute component action or with Toggling Modal - Open variable.

You can try this solution
when open modal or sidebar
wwLib.getFrontDocument().body.style.overflow = “hidden”;

wwLib.getFrontDocument().documentElement.style.overflow = “hidden”;

when close

wwLib.getFrontDocument().body.style.overflow = “auto”;
wwLib.getFrontDocument().documentElement.style.overflow = “auto”;

Thanks

But problem is that you can not even open the modal when you will make as component. If i can do this it will be easy.

What do you mean you can’t open the popup as a component? Can you show what your trying?

Hello,

Its going like this:

  1. I take WeWeb Modal which automatically have Modal - Open variable.

  2. I place button and add workflow on this button to toggle Modal - Open variable or make workflow with Execute component action. Everything works ok.

  3. I make this Modal as component(i need this) and here problems start. Modal - Open variable disappear and if you want to trigger modal with Execute component action you cant, because for Execute component action you need to select your modal from Component dropdown but Modal is not in list.

If this is not understandable i will make video.

sounds like your using the modal from the add panel they have a popups tab tho that are already components so use them instead. and they can be easily added to existing components to open them as well.

here are the docs again

I’d agree with Sam to use pop ups if it suits your needs.

If you really need the modal component you can do what you want but it’s stupid and clunky to setup.

Essentially the open modal action is hidden from outside the component, so you have to make a component workflow in the component and then trigger the modal open action from there and then trigger that workflow from outside the component

Here’s a quick example

Find the component in the element tree

Click on the edit button on the right hand side panel

You can open up the modal this way if you want but the next step is what you need

You create a component workflow to trigger the modal component workflow


Then create a workflow on whatever your using to trigger the open

Thanks. I will check and inform.

Thank you Sam1,

Popup solved my problems for now. Hope will note come something new in my head that will make things problematic again :slight_smile:

Thank you for idea Yaj,

I have solution now but i will keep in mind your idea if i need in future.