Saving and e-mailing entered responses

Sam Hill
Hero

Hi Allie Depoy,

What you are requesting isn't a native feature of Storyline and so would require some JavaScript in order to make it work how you would like it to. The issue you will face is that are restrictions on how much data can be passed to an email using the "mailto:" link. The "mailto: link in HTML allows you to pass data to the Subject and Body of the email, like this:

<a href="mailto:somebody@somewhere.com?subject=My Subject&body=The text body of the email">Email</a>

As you can see, in this example "mailto:" has three pieces of data, the first example "somebody@somewhere.com" is the email address that will populate the "to" field of the email, the "subject" will populate the Subject field of the email, and "body" will populate the main body of the email. Here's a list of all available parameters:

mailto (required): specifies the recipient email address(es)
subject (optional): creates a subject line for the email
cc (optional): adds one or more carbon-copy recipient
bcc (optional): adds one or more blind-carbon-copy recipient
body (optional): adds body text to the email

Note, the "?" after the email address is very important.

The above method has restrictions in the amount of data that can be passed, as well as with formatting of text. For example, you will not be able to pass in any changes in font weight, colour, size or images. The text will be plain text, and so trying to pass your data for the action plan may be possible, but could be complicated.

For example, let's say you have 4 separate input fields throughout the module, and those input fields have the following variable names associated with them: actionPlan01, actionPlan01, actionPlan01 and actionPlan04.

We would then need a way to combine (concatenate) the data in these variables for the action plan. This is where it get's a bit tricky and you need JavaScript.

Using JavaScript we would then combine these variables into a single string that can be passed to the "body" parameter of the email. Note: The characters "\r\n" are there to create a carriage return in the email.

This script/function below, would be defined when the slide loads (warning, I've not tested this code for errors):

Screen grab of the Storyline JavaScript input box

mailAP = function()
{
    // storyline player instance
    const player = GetPlayer();

    // single carriage return;
    const CRLB = "\r\n"
    // double carriage return;
    const DBLCRLB = CRLB + CRLB;

    // Static text to appear above the user input
    const ap01staticText = "This is what you said for Q1"+CRLB;
    const ap02staticText = "This is what you said for Q2"+CRLB;
    const ap03staticText = "This is what you said for Q3"+CRLB;
    const ap04staticText = "This is what you said for Q4"+CRLB;
    // Get the user input values
    const ap01userText = player.GetVar('actionPlan01')+DBLCRLB;
    const ap02userText = player.GetVar('actionPlan02')+DBLCRLB;
    const ap03userText = player.GetVar('actionPlan03')+DBLCRLB;
    const ap04userText = player.GetVar('actionPlan04')+DBLCRLB;
    // Define email subject and body
    const emailSubject = "My Action Plan";
    const emailBody = ap01staticText + ap01userText
                      + ap02userText + ap02userText
                      + ap03userText + ap03userText
                      + ap04userText + ap04userText;

    window.location.href = "mailto:update@this.com?" +
                           "subject="+encodeURIComponent(emailSubject) + 
                           "&body="+encodeURIComponent(emailBody);
}

You would then call the function "mailAP" via a button trigger:

Screen grab showing the JavaScript input on a click button trigger.

As mentioned, this method is not guaranteed to carry across all of the text, and it does require some JS know how.

There are other solutions, such as creating a printed version of the slide with all of the users action plan text on it. The user could then print to PDF, but there are limitations on what you can do with that too, due to the print being a single slide view (print HTML page).

Another solution is to use a 3rd party PDF library that could then be used to dynamically create the users action plan, allowing them to save the document. This is the most complex of the methods, but provides the best results in my opinion as you can include formatting, images, multiple pages, but you would definitely need somebody familiar with this technology to complete the work.

Let me know if you have any questions. I would attempt the first solution and see if it works for your use case. It will need some tweaking to match your variable names etc. Happy to provide a little bit of support if you want to try it.

Cheers,
Sam

2 Replies