Updating SL360 variables using javascript in web object (not working)
May 01, 2020
I know there are many posts about this topic, some from 6 years ago, but none seem to address my issue.
My web object in SL360 is a surveygizmo form. I like surveygizmo because I can add a custom js action on any page, so I've added a custom js action on the Thank You page after completing a survey. The js should update a variable in SL360, which would then mark the survey completion task "Complete" in SL. This isn't working, and I've tested many different js scripts mentioned in other discussions. I've used the following:
var player=parent.GetPlayer();
player.SetVar("varTask1",Completed);
...OR...
function updateSLVar() {
var player=parent.GetPlayer();
player.SetVar("varTask1",Completed);
alert("Testing alert");
}
updateSLVar();
...and neither are working. I've tested alert ("Testing alert"); by itself, and it is firing, so there's something with the parent.GetPlayer(); that isn't working.
I have published my course to a web server and am using Chrome. I've included a text reference to varTask1 in SL to see if it updates, but it does not.
Any ideas? Thank you!
13 Replies
I don't know how surverygizmo functions, but in the scripts you've provided, there is nothing to give the Completed variable a value to pass on to varTask1. Something like
var Completed = "yes";
If you are trying to set varTask1 to Completed, the word completed should be in quotation marks.
var player=parent.GetPlayer();
player.SetVar("varTask1",”Completed”);
I've updated the syntax per your suggestion, and still no luck. I'm including the html source code with the function updateSLVar(). If you search for "updateSLVar" in the attached HTML page you'll see where I've created and ran the function to update the variable in SL. It's still not working. Any issues with the HTML code that you see?
I see where I had an extra " in my code, and have since updated to:
function updateSLVar() {
var player=parent.GetPlayer();
player.SetVar("varTask1",”Completed”);
}
updateSLVar();
Still no go...
I've since discovered this is a cross-domain communication error, and I'll need to use postMessage(); ...hmm, not sure how, but working on it.
Hi Artur,
The code that I provided you does work. I have attached an example for you to take a look at.
I think you are running into cross domain issues. The articulate storyline course and form will have to be hosted at the same domain.
If they cannot be hosted on the same domain, then you will have to take a look at using postMessage API.
Here's an example using postMessage API.
On timeline start, there is an execute JavaScript trigger. This JavaScript creates a listener. When it receives a message it updates varTask1.
Then in the survey try:
parent.PostMessage("Completed","*");
Russell, I figured this out using very similar js to what you provided me. Thank you!
I'm concerned about using the "*" in parent.PostMessage("Completed","*"); I'm not sure what the URI should be, and I've tried "https://360.articulate.com" and also "https://app.surveygizmo.com/" and neither worked. Any ideas? Thanks again!
The "*" is known as the target origin. This could be set to where the course is hosted from.
Also in the Articulate listener JavaScript, you can check for the incoming message origin.
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
eventer(messageEvent,function(e) {
if(e.origin == 'https://app.surveygizmo.com'){
var player = GetPlayer();
player.SetVar("varTask1", e.data);
}
},false);
Thanks for all your help, Russell!
Russell, I'm testing the target origin script above, and I'm having trouble getting the variable to update in SL. I've set up this statement correctly, I believe...
if(e.origin = 'https://www.surveygizmo.com/s3/5588257/ASL3-NEO-Interview-Case-Study-Part-1-Task-2')...
With it, the variable does not update. Without it, it does. Keep in mind that I'm not changing anything in the survey's js. It's still set to:
parent.postMessage("updating varTask1 in SL","*");
I need the parent to listen for the origin because I have other iframes in the course (e.g. lightbox slides) and without the correct origin of the event, my variable will change when I open some lightbox slide in my course instead of completing the survey. I hope this makes sense.
The origin is just for the domain and not the whole file path.
'https://www.surveygizmo.com'
To find out what the origin is
Add in an alert before the if statement.
alert(e.origin);
This discussion is closed. You can start a new discussion or contact Articulate Support.