Nested Repeating Group - Hover on 1st makes 2nd visible?

Need help
1

Hey folks, running into roadblocks here and not finding solutions. I’m hoping I’m just not thinking of something relatively simple.

I have a nested repeating group used for a 2-tiered navigation bar. You have a parent/child relationship between some items, some do not have this.

When a parent (1st RG) has a child, and that parent is hovered, I would like the children to be displayed (2nd RG).

For the life of me I can’t figure out how to trigger a hover on the parent group to cause the child group to become visible. Any ideas?

THANK YOU!
Al

2

I’ve tried using Conditionals, Do-When Workflows, Custom States, and all kinds of combinations of them.

Not finding anything that hits the mark. Appreciate any thoughts!
Al

3

Even tried putting an invisible button that covers the entire cell in the RG, but can’t seem to trigger on hover in a workflow from within a RG.

There has GOT to be a way to do this?

4

Why don’t you make your own reusable element exclusively for your links?

Inside that reusable, when a repeating group item (link) is hovered/clicked, then have a group focus show.

With that group focus, you want to set its type to your nav link children filtered by your parents name or however you have it setup.

In a workflow action when hovered, clicked, etc., have it set the data type of that links element you made.

5

Hi @GH5T, thanks for the reply! The menu is already a reusable element.

Problems I’m running into:

  • Within a Workflow, I don’t seem to be able to identify a hover event from within a RG item.
  • Within a Conditional, I don’t seem to be able to change a Custom State or any Element attributes beyond that particular Element.

Note that the hover event I’m looking for is on the Group that contains the icon, the text, etc.

6

How complicated is the inner repeating group? If it is just a bunch of text, you can easily do this with air tooltip plugin.

7

Okay I know what you mean by this. I forget if there is a plugin for this, but this is a good thing for me to implement in my toolkit I think. Ideally somewhere where you can target an element ID and trigger a reaction based off that possibly.

So… to fix this for you, I just added a new feature on my plugin.
The element is called Scoper. This will do exactly what you need.

It will trigger an event on your target ID, and publish a state, so you can use conditionals OR workflow actions on your elements with ease. Works on ANY element.

Make sure you have HTML ID Attributes setup on your app, and then dynamically apply an ID per item. Then you can trigger your items dynamically.

8

Ok, interesting. Thanks @GH5T!

I need a little guidance though.

This is an example of my nav bar. User currently on the HOME page, cursor hovering over SLACK item.

image
image201×580 11.7 KB

Set the ID for the group (RG item) that is being hovered to group-nav
image

Set the Scoper Target ID to group-nav
image

Tried to get a Workflow to trigger visibility of 1) a Group Focus or 2) a sub-group from the main. Neither seem to be showing up.
image

image

What other options do I have here?

9

You’re not assigning it a unique ID.

After the ID, add dynamic info: some-id-(current cells index).

10

Hey @GH5T, adding that didn’t seem to change anything. I had to remove it all due to a release, but will try this in a playground later. Anything I might be missing?

If you happen to have a demo available to see how you’ve set it up, that would be great. I’ve not seen anything on the demo page nor the forum post that explains the scoper.

Cheers!
AL

11

Hey @hergin, I’m certainly contemplating this as an option. Of course requires each item in inner RG to be clickable. Styling matters, too, which is why I’m just trying to do a simple RG (but obviously struggling!)

12

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