Use instance method to communicate between app instances

On a product page, an app can be deployed in multiple placeholders. Also, an app can open certain generic interfaces (such as, modals, confirmation message boxes, or dialog boxes). The multiple placeholders and the interfaces are considered as different app instances. For synchronized app-logic processing, these interfaces must communicate with each other. Instance method is a run-time interface that enables this. Using the instance method, an app can also resize or close an app instance.

Resize an instance

Use the client.instance.resize() method, as shown in the right pane, to set the height of an app instance (in modals and dialog boxes).

Close an instance

Use the client.instance.close() method, as shown in the right pane, to close an open modal.

Methods reference

get

Use this method to obtain the context information of all active app instances. For information on how to use the method, see the right pane.

send

Use this method to send data from one app instance to another. Alternatively, to send data from a parent instance to a modal, the parent instance can use the showModal method itself by including a data parameter in the modal trigger.

For information on how to use the method, see the right pane.

Note:For data to be sent successfully, the receiver location must be active when send() is executed. To obtain the list of all active receivers, use the get() method.

receive

Use this method in an instance to receive data sent through the send() method from another app instance. For information on how to use this method, see the right pane.

context

Use this method to retrieve contextual information about a current app instance. For example, if a modal is the app instance where context() is used, it retrieves,

  • The (modal’s) instance id
  • The placeholder name of the app instance
  • The instance id of the parent that opened the modal
  • The data (if any) that was passed from the parent

If context() is used in a parent placeholder, it retrieves,

  • The instance id
  • The placeholder name of the app instance

For more information, see the right pane.

Use case based explanation

Usecase1: The parent app UI has a form with fields Name and Email. It has a Show Modal button to trigger a modal. Use the sample code in the right pane, to send data - the name and the email entered - from the parent to a modal and retrieve the context/data in the modal.

Usecase2: The modal has the fields Name and Email. It has a Send button. Use the sample code in the right pane, to send data - the name and the email entered - from the modal to a parent placeholder; receive the data in the parent and display it.

Usecase3: The app is deployed at two placeholders - place_holder1 and place_holder2. place_holder1 UI has a form with fields Name and Email. It has a Send button. Use the sample code in the right pane, to send data - the name and the email entered - from place_holder1 to place_holder2; receive the data in place_holder2 display it.