Category: UI Widgets
Updated

This solution is summarized from an archived support forum post. This information may have changed. If you notice an error, please let us know in Discord.

Is there a way to call a JavaScript function embedded inside an iFrame widget

Issue

I needed to embed an HTML script consisting of a JavaScript function inside an iFrame widget and then call that function from another widget such as a button. Appsmith did not have a way to directly call the JavaScript function embedded in the iFrame, so I found a workaround using the parent.postMessage method. However, I recommend that Appsmith add a capability to call JavaScript functions embedded in an iFrame to give users more flexibility in customizing their widgets.

Resolution

The user was trying to embed an HTML script consisting of a JavaScript function inside an iFrame widget and then call that function from another widget such as a button. They shared their script which included a table and a function named "getPositionData()". Initially, they were not able to call this function from another widget such as a button. However, they found a workaround by posting a message to an iFrame widget using "parent.postMessage" and then getting the message on the Appsmith button using {{iframe.message}}. They also embedded the data as a variable to post the data back. This solved their problem but they recommended adding a capability to Appsmith to call JavaScript functions that are embedded along with an HTML script inside an iFrame. Appsmith replied that they are working on a window.postMessage feature which will help the user out with this issue in the future.