Display Variable Text for Learners to copy/paste

I have been looking for a solution to allow learners to copy and paste text back into a document or other text editor.  I have a linear course that asked for the learners thoughts at 5 different times. I collect their thoughts as  via Text Entry Fields, then display it back on a summary page as we wrap up.

I am trying to empower the learner to copy and past their thoughts into a document or online text editor.

Any thoughts on empowering my learners with the information they come up with along their own journey.

I am successfully showing the variable text inputs in a summary page, no help needed there.


Thank you

7 Replies
Sam Hill

Hi Randy, I understand the text is not selectable. You could possibly use a WebObject to present the text, making it selectable. It requires a bit of JavaScript know how to do. I have put together and example that is just using a single text input and re-displaying it in a WebObect.

In order to preview, you'll need to run through Review 360 or a webserver.

Ali Al-Shufafa

Hi Sam,

Can you please explain more how do you use a web object (outside Storyline folder) to show the input from the learner? I've tried your input-output project and I noticed that the path of the web project is local.

Should I assume that the first slide needs to have JS to post variables to an external file and the second slide calls this variable from the same external file?



Sam Hill

Hi Ali, the path to the WebObject is local, but once imported, it is part of the Storyline file.

You don't need to POST any variables. As long as the variables are in Storyline, you can then access them using the following method:

var player = GetPlayer(); // get reference to Storyline player
var input = player.GetVar("userinput"); // get value of variable named "userinput" from Storyline file.

You will see when using a WebObject, because it is in an frame, you need to get the player slightly differently.

var player = window.parentGetPlayer(); // get reference to Storyline player (its in the parent frame)
var input = player.GetVar("userinput"); // get value of variable named "userinput" from Storyline file.

If you need to concatenate multiple user input, you would just do something like the following (assuming your Storyline variables are named userinput01 to userinput04:

<div id="output"><!-- this will be populated with the variable values --></div>
var player = window.parent.GetPlayer();
var userinput = "";
userinput += player.GetVar('userinput01').replace(/(?:\r\n|\r|\n)/g, '<br>');
userinput += player.GetVar('userinput02').replace(/(?:\r\n|\r|\n)/g, '<br>');
userinput += player.GetVar('userinput03').replace(/(?:\r\n|\r|\n)/g, '<br>');
userinput += player.GetVar('userinput04').replace(/(?:\r\n|\r|\n)/g, '<br>');
document.getElementById('output').innerHTML = userinput;
Ali Al-Shufafa

After a few trials, I've managed to run it.

For new readers interested in this, I'd like to draw your attention to a few basic steps. These might be very intuitive if you are already familiar with programming.

1. the zip file REBUS017_-_Input_Output_Demo.zip contains the storyline file and a folder called webobject.

2. Copy the webobject to your harddisk.

3. Run the storyline file Input Output Demo.story.

4. Go to Slide 2: Demo 02 - Output and open the Edit Web Object.

5. Change the address by browsing the files and locating the path of the weboject folder you saved in Step 1.

6. Publish the project to a server. The project will NOT work from the local drive.


Thank you Sam for sharing and explaining.