JavaScript TIP: Combining several variables into one [Advanced usage]

Hi everyone,

As I'm quiet new to the community, I'd like to share a piece of JavaScript code that I often use. 

As some of you might know, we can actually send text(instead of sending a score) to the LMS even if you're doing a Multiple choice slide. We do that by creating a for example, short survey slide, and build your own custom multiple choice interactions. The user would have no idea that they are on a short survey slide, as they just have to tick some boxes.

Say you have 1 variable called TickBox_01, and you want to send that to the LMS, that would be pretty easy, as you would trigger the value of TickBox_01 to equal to ShortSurvey. This way the user clicks on a box, and behind the scenes it fills the hidden short survey text field, ready to send to the LMS.

Now let's take this a step further, as we sometimes have to deal with Multiple variables on a screen, and the short survey field will only allow 1 string of text.

How do we do that? JavaScript.

Below you find the code i use to combine a X amount of variables and combining it into 1 variable, which I then fill the short survey field with.

TL;DR - This code can be used to make multiple vars, 1 variable. It also tidies up all empty values.

Make sure to trigger this JavaScript on for example a Submit, or any button/action you like.

var player = GetPlayer();  //required to make JS work in articulate

var value_01 = player.GetVar("TickBox_01");
var value_02 = player.GetVar("TickBox_02");
var value_03 = player.GetVar("TickBox_03");
var value_04 = player.GetVar("TickBox_04");

var array_01 = [value_01,value_02,value_03,value_04];

//below we make an array of the variables above, also it cleans out if there is any variables that have an empty value, removing it from the array

var newArray_01 = [];
for (var i = 0; i < array_01.length; i++) {
 if (array_01[i] !== undefined && array_01[i] !== null && array_01[i] !== "") {
newArray_01.push(array_01[i]);
 }
 }

//articulate only allows text strings, so we need to convert this array to textvar ArticulateTextString = newArray_01.toString(); 

//this replaces the comma's and gives you a break(arrays have comma's)
ReadyToArticulate = ArticulateTextString.replace(/,/g, '\n'); 

player.SetVar("TickBoxTotal",ReadyToArticulate);

Make sure to have a, in this example, a 'TickBoxTotal' variable setup in articulate, else it won't be able to save the variable for you.

Another great way of applying this method is when you have, for example;

• 10 tick boxes that users can select on Screen 1
• Each tick box contains a value
• If you run that JavaScript, it will combine all the variables of the 10 boxes, that have a value(leaving out the empty ones).

• You can now use 1 variable on Screen 2, to display a neat list of what the user might of selected. Of course you can also paste all 10 variables on Screen 2, but that would leave gaps, if the user didn't select one of the tick boxes. This JavaScript code eliminates the gaps for you!

If there is anything unclear, or you have tried a screen using this method, but it ain't working, let me know and I'll help you out.

Want to test the JavaScript? Make a Publish and run the story.html5, no need to upload your course.

Have a nice day and good luck!