Initial content isn't visible

Hello folks, I’m challenged by the initial content of my inputs. If I run the page it doesn’t work. The initial content in my popup is not visible

In case you are getting data for the initial content of your inputs, where are they located within a popup that is invisible? Is this data located within groups within this popup? Can you explain a little more?

You know I displayed data from outside the popup to the popup itself. There’s this display data action you can add to your workflow.

I don’t quite understand.

Can you bring me some screenshots or a better explanation of your flow?

Are these inputs inside the popup, and do they have to have initial content?

Or

Is the invisible popup serving as a data source?

You know I display after opening the popup as you can see in my workflow. Inside the popup I do have the inputs and in those inputs I intent to have initial content.

And that data being passed on this popup display, is the data going?

Naturally, the data go to the popup

bubble does things a little backwards. Typically you wouldnt need to externally set the data in the popup. In fact you cant really set the data on elements.

Instead elements pull data from groups or from the database directly using searches.

So you could set the data on a group or a state of the popup and then the elements in the popup set their data from the group or the state.

But you can also have the elements do a search for the data themselves and pull the data directly.

This enables all elements to dynamically show the correct data at all times. If you have a workflow that does a search, then sets the data in the popup the record itself wont automatically change though the underlying fields of the record will dynamically change if they get updated while you are looking at the popup.

A huge benefit of bubble is that the elements themselves can do the original search to find a record (or records). If the result of that search changes, then the popup would automatically show new records that match the search.




Maybe those three screenshots will give further explanation about my issue

Good, if the display is passing the data, and now with your prints, just check if the parent groups of the input are getting the data source from the Popup.

You have the offer group, its parent is also the Offer Group, and its parent is another offer group. Check if each one is getting the data from the parent. For example, the first Offer Group must have the popup data source, and so on from child to child.

Or, if you want, in the Offer Group that has the inputs, just change the data source to Popup Edit Offer’s Offer.

Thank you for the hint. Indeed, it wasn’t every group well-described.
Yours sincerely,
Stappler

The approach suggested by @carlovsk.edits is one of the approaches that can be used. But I personally only use it in some complex situations that need segregation of nested data objects, depending the logic.

In this approach the parent container (the main container) receives the data, in your case the popup itself, and all child containers need to point to the content of its closest ancestor until reaching the input.

So we would have something like this:

  1. Popup
  • 1.1 Form Container
    • 1.1.1 Input 1 Container
      • 1.1.1.1 Input 1 (content based on the content of the input container)
    • 1.1.2. Input 2 Container
      • 1.12.1 Input 2 (content based on the content of the input container)
    • etc…

The downside of this approach is that if you have a large form with dozens of inputs, you will have dozens of references. Any subsequent reuse of that form or inputs (by copying and pasting) where the data source or logic is slightly different will result in issues in all (or almost all) of these references, which you will have to fix.



Another approach, cleaner and suitable for practically all cases, would be to just send the data to the popup (the main container). So, instead of creating dozens of references to nested child or descendant containers, you can reference directly in the input, pointing to the content of the main container (the popup).

In this case we would have something like this:

  1. Popup
  • 1.1 Input 1 (content based on the Popup’s content)
  • 1.2 Input 2 (content based on the Popup’s content)
    etc…

This makes maintenance much easier and faster and facilitates the reuse of components that need to be eventually copied (either within the app itself or to other apps).



Here we are talking about Popup, but this applies to other structures that use any other type of container as the main container that will internally have dozens of references to the same type of data.

1 Like

Excellent explanation @newed

1 Like