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.
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.