Append text to an existing text variable
Sep 29, 2015
Hi Heroes.
So I'm in the early design stages of my most ambitious course yet. Essentially the course is about doing some research and there are multiple paths that the user can take through the slides and scenes.
Any time they find something useful, I want to have the option of allowing the user to save the facts they discovered to a notebook in the course.
All my slides would have a "view notebook" icon that would bring up the notebook with whatever was saved in it.
So I'll have a Text variable called "var_Notebook" and on the slides where I have a fact they could save, there will be an button to do that. When the user clicks the button, essentially I just want to do something like var_Notebook = var_Notebook + New_Facts, which would append the new facts to the existing Notebook facts.
There won't be any user text entry here from typing. All the facts are in the course already, I just need to append them to the var_Notebook variable when the user clicks the button. As an added bonus, I would love for them to maintain their formatting. (Bold, some bullets, nothing really crazy)
Is this even possible?
7 Replies
I'm going to answer my own question here, just in case someone else needs it.
The answer is yes, this can be done. But you have have to use JavaScript to do it. And it even maintains the formatting of the text if you follow the rules properly.
I've attached a .story file. Remember that JavaScript does not work in preview mode, so you have to publish it to get it to run.
On the slide, you can click the three buttons (or any 2 or just 1) in any order and then click the "notebook" button and you will see that your text will be displayed in the order in which you clicked the buttons, just like a real notebook. Erase the notebook with the button, go back and try a different combo for different results.
Also, the text on the screen on the base layer is for display only. The actual text that is added is located inside the JavaScript trigger in the buttons. Any other method seemed to not work, or to lose the formatting. But this way I can use basic HTML tags and it all seems to work OK.
Thanks John for the update and sharing your example here. Javascript is not one of the elements our team can assist with, so having more ideas and examples from the community is always great!
Thanks for the update and for sharing your solution John :)
John,
This is great, as I was just thinking about this issue this morning. I knew it could probably be accomplished with javascript, but wasn't exactly sure where to start. Now I just need to remember where I was going to use it! :) Thanks! (I've saved your story file for when I DO remember)
Mike
Glad this helped you out Mike and hope you remember soon!
Hi,
This is great. I have another request. I have multiple check boxes which if a user selects should append a text box with a ";". While I used the method above, I am unable to delete the text when a user unchecks a check box. It just adds another value to the box. Can somebody help me with this?
Hi Sumit,
Are you changing the addition of the ";" on the user clicking or what the state of the checkbox is? I haven't seen a lot of examples of adding additional text to an existing text entry, so I'd suggest sharing a copy of your .story file here so that folks in the community could play around with what you set up.
This discussion is closed. You can start a new discussion or contact Articulate Support.