Print user input from text entry fields

Jan 26, 2018

Hi All,

Click to see a demo here

I just finished making a simplified (though still HTML-heavy) method to collect and print user input from text entry fields.

There are some excellent posts on this topic already - notably Matthew Bibby's Printable Workbook and an elearning brothers demo - but I wanted a super basic method. In my project, you don't have to insert a separate html file after publishing.

Look at the "code" in the JavaScript trigger (see attached story file), and let me know if you have any questions. Most of the code (the middle section) is actually just HTML and CSS broken up into pieces so it is organized. 


13 Replies
Joe Dey

Hi Eric that's a great bit of work and extremely useful.  I had a similar workaround but it used an external html file which saved notes perpetually and printed to any printer installed including to PDF.  Worked from a publish to web directly from the hard drive.  I like this as it does a better job.  Many thanks for sharing.

Christine Connolly

Hi Eric. I found this very useful, and have adapted it to create a single text entry field that learners can use to type in their notes as they work through the module. However, the carriage returns don't carry through, and so everything runs together. I wondered if you know whether there's a way to have the printed version carry through the carriage returns that have been entered within a text input field?

Anna Hoffman

If you want any "enter breaks" from the data entry fields to be included in the printout, try adding the code below to step 2. It works for PCs, not sure about Macs or Mobile devices as I have not tested it on these platforms.


Anna Hoffman

Hi, the code I used for step two looked like this:

// Step 2. The HTML Section - with the Storyline variables inserted

var contents = "";
contents+="Here are your notes from the ___________ course";