Expand my Community achievements bar.

SOLVED

Rule not firing on click event

Avatar

Level 1

I'm trying to create a rule where when a user clicks an icon on the page the rule fires. The icon is however within an iframe, and i cannot target the URL. 

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Any user interaction within an IFRAME usually cannot be detected by the parent frame, which is where your Launch property is. And so Launch will not be able to detect those interactions/events.

If you can add code to the page in the IFRAME, consider using postMessage() in the IFRAME to send the event data up to the parent frame. Then within Launch, you can use window.addEventListener('message', callbackFunction) to handle those events as you wish.

View solution in original post

7 Replies

Avatar

Correct answer by
Community Advisor

Any user interaction within an IFRAME usually cannot be detected by the parent frame, which is where your Launch property is. And so Launch will not be able to detect those interactions/events.

If you can add code to the page in the IFRAME, consider using postMessage() in the IFRAME to send the event data up to the parent frame. Then within Launch, you can use window.addEventListener('message', callbackFunction) to handle those events as you wish.

Avatar

Level 1
I am quite new to this - is there a working example that i can follow anywhere?

Avatar

Level 1
<iframe id="myIFrame" src="about:blank" width="100%" height="1024"></iframe> where should i use postMessage()?

Avatar

Community Advisor
I don't think the method will work if your IFRAME's src is "about:blank". Instead, if your IFRAME's src is "page.html", then you'd include the postMessage() in page.html.

Avatar

Level 2
Can this work if there are multiple things I want to track in the iFrame? I want to capture the name of the visulaisation in the iFrame and also the button they clicked on. Can I do that with postMessage()? Also, if I do get this implemented, how do I access this in Launch? What type of rule do I need to create? Thanks.

Avatar

Community Advisor

Yes, the postMessage() allows you to send any string from the IFRAME to the parent, so it's up to you to decide how you want to structure that string with the required values that you want. A JSON sting might be the easiest, simplest format to use.

In Launch, you can detect a postMessage() by using a "Custom Code" event. In that Custom Code, use this:

window.addEventListener('message', function(event) {
  if (event.origin === 'www.iframe-domain.com') {
    trigger();
  }
});

You can then use your postMessage()'s data in your Rule's conditions and actions like so:

%event.data% 

or

in Custom Code, event.data.