Pass Data Between a Fragment and Its Parent Container

Passing data between a fragment and its parent container (say, a page or another container like a different outer fragment) involves enabling fragment variables as required or optional input parameters to the container. It’s also possible to enable the variable to “write back” directly to the container.

Passing Data From a Page (or Outer Container) to a Fragment

When you define fragment variables and enable them as required or optional input parameters, a page or any container that consumes the fragment can provide values for the input parameters. A page, for example, can define or associate its variable to a fragment’s input parameter. This way, a page variable’s value is used as the initial value for the input parameter enabled in the fragment. See Enable Page Variables to Provide Initial Values for a Fragment’s Input Parameters.

When the same page variable’s value changes “mid-cycle”, the updated value is automatically reapplied on the fragment input parameter and an onValueChanged event triggered on the fragment variable.

Passing Data From a Fragment to a Page (or Outer Container)

There are two ways to do this, and the option you choose really depends on your business use case:

• When a fragment variable is enabled as an input parameter, you can additionally choose to write it back to the container. This option allows changes to the fragment variable to be automatically written back to the page variable that was used as the input parameter.

• While automatic writeback to a page variable is convenient and powerful, there may be cases where multiple changes to the fragment variables occur (say, the variable’s state needs to be gathered and raised via a custom event). For such scenarios, you can define custom events that “emit” from the fragment to the fragment container. A custom event that emits to the container can provide information to the page (or container) that references it. It’s important to remember that there are two types of custom events that can be defined in fragments (the one discussed here is the second type in this table):

  Event Type	Description
  Events that can be handled by listeners defined in the fragment	These events are similar to other custom events in VB Studio and are used to communicate consolidated state changes made in the fragment to the outer container. For example, a fragment defined as a multi-step survey may raise a regular custom event for itself and its extensions to take note (say, on a Next button), but after the survey is completed, it may communicate the completion state (along with the entries) to the outer container.
  Events that “emit” to the container	These events are used to propagate values to a fragment’s parent container. See Create Custom Events that Emit to a Fragment’s Parent Container.