How do I use postMessage to send complicated data from page code to an HTML element?

Ask the community
,
1

Hey guys, I wanted to see if someone could help me out with a problem I am having. I am attempting to pass a message from my page code to an HTML element. I have successfully tried a similar version where I passed a message containing a value to an HTML element that was set up to display text when I pressed a button. I got all of that from the Corvid documentation and it went well. My ultimate goal, and what I am having issues with, is sending a message to an HTML element that is intentionally not set up to display text. I’ve attached a JS Bin link below, but essentially the HTML element is holding a three-dimensional model that updates automatically when different parameters are changed. Commands can then be called in the console to change the parameters (api.parameters.updateAsync({name:“Floor to Floor”,value:15}) (you can clear the console and then add that in as an example). My thought was to send those commands as messages but while that has so far been unsuccessful, I am not sure if it is because the message is not getting there or if it just doesn’t work like that. I used a console.log on the example postMessage I did and I got a response and the message went through, but I have not yet received a notice that the message went through vie console.log for this recent attempt. Thanks for any help you can provide!

Jake

2

The JS bin has my HTML for the html container but I forgot to add my page code:

export function GoButton_click(event) {
// This function was added from the Properties & Events panel. To learn more, visit Velo: Working with the Properties & Events Panel | Help Center | Wix.com
// Add your code for this event here:
//$w(“#TempContainer”).postMessage($w(‘#FloorToFloorSlider’).value);
$w( “#SDVcontainer” ).postMessage( “$w(api.parameters.updateAsync({name:‘Floor to Floor’,value:$w(‘#FloorToFloorSlider’).value)})” );
}

3

I don’t understand your postMessage. $w is a selector for page elements, so what is this supposed to do: $w(api.parameters.updateAsync()) ? Also, you have the whole postMessage parameter defined as a string.

You state that you want to " send complicated data" to your embedded script. That shouldn’t be a problem as you can " send and receive data as any valid JavaScript type." See the section on Messaging for more information.