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.

Here are to 2 actions in order, when the item in repeating group is clicked.


Debug details

  1. On clicking 1st item



  2. On clicking 2nd item




:no_mouth:

1 Like

It’s difficult to assist properly without being in the editor myself, but I’ll try nonetheless:

  1. Create two workflows instead of only one: Workflow one fires when the item IS NOT on the list (and then adds the item) and workflow two fires when the item IS on the list (and then removes the item) → This might result in a better behavior than what you currently use

  2. With the GCS Plugin it might be advisable to wait for a small fraction (maybe 200ms) of time before referencing the field again in other actions (Such as your alert). My guess is that the WF Actions don’t fire in sequentally or the GNC needs a bit of time to load the data into the state before its available.

Hi!

Like i said in another message, the problem comes from Bubble.
Let me explain:
When you enter a workflow, it’s like everything that is used inside is “frozen” once used. The underlying thing (i presume) is the cache system put in place by bubble for each function (for example, if at the beginning of your workflow you use Current Date/Time, and you use it again at the end, you’ll get the same result).
BUT, Bubble has made a choice to have a displayed front very very fast, the most responsive.

So, what’s happening with the plugin:
in my JS code, when you use the publishState function (which is a function provided by Bubble to update the value of a field), bubble does it in 2 steps:

  1. it updates the displayable value (remember: having a responsive display as an imperative)
  2. it updates the value itself (but not in the same workflow as the “values” are frozen from the moment it has been used once)

It seems that in that case, Bubble (at least for plugins) handles 2 values (one for display and one for manipulation), and that the publishState’s second step is triggered “when it’s appropriate”.

you can try to do some stuff inside a Custom Event… But no guarantee it’ll work…

So … in fact, that’s not a bug, that’s a Bubble feature…

2 Likes