Get data from a reusable element within a repeating group

In my application I have created a Reusable element. This element is placed inside a repeating group. Within the reusable element I have another repeating group. When an Item is clicked in the reusable element’s repeating group, I set a custom state for the reusable element. I wish to pass with same custom state to the parent repeating group. How to do this,.

- Repeating Group [**where I wish to pass the data**]
     - Reusable element [Here the custom data is set]
          - Repeating group [here the click happens]

Fellow developers . . Please share your thoughts on this.

Hi @minto,

in native Bubble it’s not possible to access this deeply nested states. To send this data out, instead of using a state you can either:

  1. Use custom Javascript
  2. Use the BNS Global Custom States Plugin → This was developed by Guillaume to set states on a global level without having to attach the state to a (nested) element. This makes the data accessible anywhere and is precisely what you need. :slight_smile:
1 Like

I think if you create a property on that reusable, you can both change that property from the inside of the reusable and an external element can access it.

Could you not create a custom workflow inside the repeating group that returns some value? I think I’m using that in one of my apps.

1 Like

Thank you Rico.trevisan.
If I create a custom event that returns some value then it will be only accessible within the reusable element only.
How will we take the data out from the reusable element ?

If you meant to create custom workflow inside the parent repeating group pls share more details on the ways to do it.

Tell me if I understand what you need correctly and if my use-case is something that will work in your case?

I have reusable called statuses. It’s a button, that, when clicked, displays RG with statuses pulled from an option set. Once the status is clicked, the reusable is set to this status, which is then passed to an RG, that displays it as a given task status and updates it in the db?

If that is what you are looking for, I will share the setup once I get to the PC

I just ran a check, and I was able to access my repeating element (RE)'s custom states (CS) from the page holding the RE.

One thing you need to make sure of is that the CS are set on the RE itself, not on an element within the RE.

Url params are your easiest route most of the time. Or, hit it with a pick-axe and see what happens.

1 Like

I used global custom states list ; There are objects that need to be added[plus:] as well as removed[minus:] . I am not able to remove a single object from the list. Is this a bug with Global Custom Menu

I liked the idea of global custom state and i implemented in a project. But having hard time to add and remove items from the state list.

Add an item of property a → remove a item if there is already an item with property a … This is what i am trying to achieve.

  • When i add items to the state list - It works. Proof can be seen in a Text View in project, which shows the items in the list.
  • When i have to remove the item [minus item] , the above said text shows nothing [which is the desired value] , but a toast shows the value/item is still there.
  • in next action i have to add another item to the state list. The item was added along with the removed ones. That is i have 2 items now; the removed one + the new one.

It is confusing … is this a bug. Where should I report this? Please help me to understand this.

yes , custom state of a RE can be accessed in the way you mentioned. But here i am using the RE within a Repeating Group. I cant find a way to access it. The usage of BNS global state plugin gave some success, But i guess it i s buggy. Please check my other replies in the same post.

Have you considered presenting your data on the page in a different way? Nesting an RG in an RE in an RG could be costly in workload units, making your app expensive. It could also make the app slow and users impatient. It’s also a lot less likely to fit on a mobile screen and still be legible. Web apps on mobile screens are reduced to approximately 320 wide x 640 high pixels, regardless of the device’s actual screen size in pixels (to make apps look more or less the same on all smartphones).

My app also has (logically speaking) nested data in the database, but I would never present it the way you have for the reasons above. In the first version of my app, only the outside RG shows. Users can click on an item in the list and be taken to another page with the inside RG. Eventually, I’ll combine them on a page by hiding one RG or the other and only presenting one RG at a time.

Another possibility–if you can make it work on a mobile screen–is to have the outside RG be horizontal at the top of the page (maybe in a carousel–there’s a plugin for that) and the RE with the inside RG below it. This would make the RE and outside RG equal peers on the page.

In the worst case scenario, you could use a page-level CS as an intermediary to transfer data. It would probably be less buggy than a global CS.

If you really want to present everything the way you currently have it, you could learn about the local storage options (such as cookies) and use a plugin for that. My app will probably go this route so that data only needs to be pulled from the backend once (protected by privacy rules or workflow conditions) and then stored in the frontend, since I’ve heard rumors that Bubble doesn’t always cache as well as is claimed.

Don’t be married to one way of designing a page. Brainstorm other ways. You might find an even better way–or at least a compromise that works better on Bubble.

Could you record a quick loom so that I can see the issue?

Assuming you are using the GCS Plugin by Guillaume, working with “minus item” or setting the state again with a new list shouldn’t be an issue in my experience.