Prevent a popup from scrolling?

Need help New Responsive Engine
1

Hi everyone!
Hope everybody is well.

[Check screenshot below]
I’m facing a problem regarding a popup. Despite looking for an answer in the forum, I couldn’t find anything.
Disclaimer: I’m using the new Responsive builder.

So I’ve got this popup that has a fixed height (500-ish pixels), and that is essentially made of 2 groups, as you can see on my screenshot.
However, the group B contains a couple of repeating groups and its length could potentially significantly expand, depending on the user’s inputs.

As a consequence, I would like that whenever the group B content overflows, the user could scroll only within this group B, and not whole popup. You can probably see why: Group A basically contains the title of the popup and I want it to be always visible, even when one scrolls group B.

Natural solution that came to my mind was to:

  • Make the popup (and group A) fixed height
  • Make the group B non-fixed height and infinitely expandable and fit its height to content + allow vertical scrolling when content overflows.

All good so far… but there’s a problem: The Popup itself will automatically be scrollable if its content overflows! So with these setting, there would be two scrolls at the same time: Popup and Group B.

So I’m basically looking for a solution that prevents the popup to be scrollable, as it’s not an available parameter right now. I only want Group B to be scrollable.

Would you have any idea about how to do it? Maybe a little piece of code?

Sorry for the long read, and thanks in advance for your help.
Have a great day,
Nico

Capture d’écran 2022-05-15 à 18.59.57

2

Make Group B have a maximum height rather than fit height to content.

if that doesn’t work, then I would make the maximum height of group B just 1px less than what you’d expect it should be based on the height of the popup.

I’ve found the fit height to content with allow vertical scroll produces strange behaviors and also have found that expecting heights to match according to math (ie: popup max height =500. group a fixed height = 100px so math would assume group b max height =400) doesn’t always produce the expected result for the main container…in this case I’d think that 1px value may cause the popup to get the scrollbar as well.

No need code, just got to play around a bit more I believe.

3

If I understand correctly, I can think of at least a couple different ways. I think you’re on track with the scrollable group approach. Let me know if this is the behavior you’re looking for.

2 Likes
4

Thanks for your answer.
I confirm this is exactly the behavior I’m looking for!! :slight_smile:
Nico

1 Like
5

Thanks a ton boys, I found the solution by reproducing @sudsy sudsy’s link. Extremely useful!
Solution seems a bit odd to me, but it does work - and it’s not far away from your intuition @boston85719 :

For the Popup:
Capture d’écran 2022-05-16 à 09.30.35

For the Group B:
Capture d’écran 2022-05-16 à 09.31.09

Thanks again to both of you for your help!
Nico