Hi all. I am having an issue with dynamic pages.
I need to have a cell in the database that is the embed code from another site, and have it be inserted into an HTML element for each page.
I have ready, genuinely, all of the threads and documentation regarding postMessage and onMessage, and I still have not been able to come right. I’ve had simple implementation that was working, but since broke and cannot get working again.
Another option that I considered is that all the embeds use the same structure, so getting the dynamic variables and passing those into the HTML element and having them as variables in the embed code that I have copied in, but I cannot manage to interface with the HTML element.
I am sorry to mention you, @yisrael-wix , but I have noticed that you seem to be the brains behind every post similar to this.
Thank you all.
You can’t just insert code into an HtmlElement using Corvid, however you’re on the right track with your second option. You can pass the “dynamic” part of the code by posting a message to the HtmlElement.
See the article Corvid: Working with the HTML Element for information. You’ll want to pay special attention to the section on Messaging . You can send a message with the dynamic content to the HtmlElement. When the HtmlElement receives the message in the onmessage() event handler, you can then “embed” this dynamic content into the script using the usual Html coding techniques.
It’s a bit complicated, but I diid this for a project once and was successful - after some considerable playing around with the HTML code.
Hi Yisrael, I have read through those before, but I am struggling to get the final pieces together.
I have a variable called “domain” in my database, as well as an HTML element with the ID of “#html1”.
In the page code, I wrote:
$w.onReady(function () {
$w("#dynamicDataset").onReady(() => {
let currentItem = $w("#dynamicDataset").getCurrentItem();
console.log("Dataset Loaded");
$w("#html1").postMessage(currentItem.domain,"*");
});
In my head, this is correct to grab the value of domain and push it to #html1 as a message.
from there I need to recieve the message in the HTML element with onMessage, and I did that like this:
<body>
<br>
<span id="spantest" style="color: white;">Test Text</span>
<script type="text/javascript">
window.onMessage(event () => {
console.log("Message Recieved");
});
</script>
</body>
I am unsure whether the onMessage needs to be, window.onMessage(), window.parent.onMessage(). I am also not sure whether it needs to be within:
function init(){
// message recieve here
};
Could you help me in understanding this?
Hi Yisrael, I have read through those before, but I am struggling to get the final pieces together.
I have a variable called “domain” in my database, as well as an HTML element with the ID of “#html1”.
In the page code, I wrote:
$w.onReady(function () {
$w("#dynamicDataset").onReady(() => {
let currentItem = $w("#dynamicDataset").getCurrentItem();
console.log("Dataset Loaded");
$w("#html1").postMessage(currentItem.domain,"*");
});
In my head, this is correct to grab the value of domain and push it to #html1 as a message.
from there I need to recieve the message in the HTML element with onMessage, and I did that like this:
<body>
<br>
<span id="spantest" style="color: white;">Test Text</span>
<script type="text/javascript">
window.onMessage(event () => {
console.log("Message Recieved");
});
</script>
</body>
I am unsure whether the onMessage needs to be, window.onMessage(), window.parent.onMessage(). I am also not sure whether it needs to be within:
function init(){
// message recieve here
};
Could you help me in understanding this?
Needs to be window.onmessage() just as described in the section on receiving a message .
See the following example for an example of messaging:
Multiple Markers in Google Maps
Embed Google Map on your site with multiple location markers , marker clustering, and custom controls using the HTML component.
Thank you, I have read these and they helped me a lot, but I have realized that I am facing a new issue of Cross origin request blocking.
(I am debugging in the in browser editor as this work is something I am doing for a friend as they can’t.)
This is the error I get in the Firefox console:
Do you think this is due to the URLs that the preview creates?
@luke Van,
Were you successful connecting your data value in dataset to html component? If so, Kindly share how you did.