Floating a group horizontally inside a repeating group within a 'canvas' style page?

I’ve got an infinity canvas style page which uses nested repeating groups. At the top level, inside the first RG, I have a floating group as a menu. FGs are not supported, so it’s just a regula group. It’s got a left margin but as you scroll right, it goes left. Ideally, when you scroll, it’d stick and come with you. But - you’re not allowed real Floating Groups inside a RG.

I’ve tried Relative Positioner but it’s not compatible with RGs
I’ve added a HTML element to add in the CSS but there’s a lot of extra CSS that bubble adds and even with inspecting I can’t work out what to override with extras.

I have tried extra CSS in a HTML element:

#floatygroup {
    width: 300px; /* Set a fixed width */
    white-space: nowrap; /* Ensure content doesn't wrap */
    overflow-x: auto; /* Enable horizontal scrollbar */

but no avail. I started to explore with console what’s going on, but RGs do not report horizontal scrolling events back to the browser, which adds to the mystery.

now I’m here - has anyone succeeded in this? I see solutions for vertical but this is a horizontal thing.

I’m comfortable with nonsense but this has gone over my head :frowning:

OK, I relented and moved it all into a page-level floating group. It works but it isn’t as elegant as I hoped (it loses context as you can’t move the float nearer the relevant object).

I realise a reusable element could have also worked, but passing conditions and custom states between REs is tricky and with the workarounds I could see, the WU’s put me off.

Best solution is to always create a Reusable element for your RG’s cells. The floating groups will work as expected.

What issues do you have with passing parameters to Reusables? You can have dynamic parameters in every Reusable. Also what WU cost are you concerned about when using Reusables?

I’ve got a RE to present the ‘thing’ in the RG cell, that works well. I then have the ability to select multiple RE’s across nested RG’s. To access this selection, and do anything, I found I had to keep data in a custom state level on the main page that hosts the top level RG. Maybe I was blinded, but I couldn’t see how to efficiently get RE data out of nested RGs without some kind of WU requirement (such as a database write) which is slow and costly.

One way to get your REs in your RGs to manipulate top level states is to use Toolbox plugins Java to Bubble element.

At page level, set a J2B element to run a set state action then call it from your RE using the Run JavaScript action. You can pass values to a J2B element.

This topic was automatically closed after 70 days. New replies are no longer allowed.