Group Focus blocking RG from scrolling

Need help
1

I am having a problem where a Group Focus that opens over a RepeatingGroup blocks the RG from scrolling its contents. Has anyone dealt with and/or solved this? Any and all tips would be greatly appreciated!

Thanks in advance.

2

Could you provide more context about this structure?

Where is its group focus located and how does it open through the repeating group? Some screenshots with more context of the structure itself would help :slight_smile:

3

This usually happens because the Group Focus is intercepting scroll events. Set the Group Focus to not be scrollable and keep scrolling enabled only on the RepeatingGroup. Also check that the Group Focus does not cover the RG with full height, even transparent layers block scroll. A common fix is to place the RG inside a separate group and keep the Group Focus outside that container.

4

@carlovsk.edits The group focus contains a filter menu that itself is a reusable element, and is located inside another reusable element. That parent reusable (see below, PC-Include-OKR HeaderActions) sits on another page that contains a RG with the data; this is the one that does not scroll when the group focus is opened over it.

image
image1851×444 26.9 KB

This is what it looks like on the main page it sits on. The list it covers does not scroll when the menu is open.

image
image427×457 18 KB

@michaelkong I checked all of that and I am still getting the same results. Does the structure I described above change anything?

5

In case anyone stumbles upon this thread, ChatGPT was actually able to give me a code solution to this.

Put an ID on the GroupFocus (here, it was GroupFocus FilterMenu). For the purposes of this example, the ID I used was gf-menu. Then add this CSS code in an HTML element (I did it in the same reusable):

#gf-menu {
pointer-events: none;
}

#gf-menu * {
pointer-events: auto;
}

This worked for me to prevent the GroupFocus from blocking mouse events and scrolling on the RG it covered.