Allow Next Slide to proceed only after Submit button in Web Object is clicked

May 05, 2022

Karls Tan
By Karls Tan

Hi,  

I have inserted a web object which is Microsoft Form meant for a short survey. 

My intention is for the "Next Slide" to only work after user click the Submit button in Microsoft Form. 

So I include a variable: goNext, which start out as 'False'

Set up a web object to display in the slide.

Include a trigger on "Next Slide" to only proceed if variable: goNext is 'True'.

I execute a Javascript at the start of the timeline,  to toggle the variable: goNext to toggle to 'True' only when user click on the submit button in Microsoft Form. Below is my script in Articulate Storyline: 

var player=parent.GetPlayer();
var goNext = false; 

if(document.getElementById('button').clicked == true)
{
   player.SetVar("goNext",true);
}

I did not get to achieve what I intended. Need advise to solve this issue. 

4 Replies
Joe Hauglie
almost 2 years ago05/10/22 at 9:30 pm (UTC)

Karl, why not disable the state of the Next button until the learner has clicked on the Form link?

Then add the web object, and create an offscreen object (like a shape) that changes state when the learner clicks on the web object or completes visiting it.

You should be able to accomplish what you are trying to do using this approach.

Good luck!

JoeH

Walt Hamilton
almost 2 years ago05/11/22 at 2:43 am (UTC)

I would add to Joe's comment that if you have a trigger to change the offscreen shape, that you can use that same trigger to make the Next button visible ( or to initiate whatever you proceed action is.)  The offscreen shape seems to me to be a superfluous step.

To get this to work, you need to set goNext to false in SL before you call the JS

Then in SL, you need a trigger to do the proceed action "when goNext changes, if goNext = true.

If that doesn't work, you will need to post your .story file here, with a description of what it is doing that you don't want.

Sign In to Reply