Forum Discussion
Live character count of essay question box
Hi Judy. I don't think you will find a way to do this without some JavaScript.
If you are still interested, I attached an updated version of your story with a working character counter.
https://360.articulate.com/review/content/55f8f9ac-4384-45f0-8330-3022588abaa7/review
I added a small JS snippet on the first slide's timeline start. It finds the email body input box, attaches an event handler which watches the contents of this box, and updates the displayed AAcount variable whenever the contents change.
I disabled the add 1 to AAcount trigger
I added two text variables in SL:
fnListener (a reference to the event listener)
refInputBox (a reference to the text input box for the email body)
I added one last snippet of JS on the timeline start of the next slide (after the user successfully submits the form) that removes the event handler that was attached to the input box since we don't need it anymore. It uses both of the new variables to know what needs to be removed.
I published your sample storyline file and the counter is not working. Any helpe
Must have been a change to SL under the hood. The previous approach does not catch input changes if they are updated internally via JavaScript instead of through the browser window.
I attached an updated version that monitors for changes to the input field's value attribute.
Small changes made to each script on the two slides (SampleEmailFillIn_charCountMod.story version).
Demo: https://360.articulate.com/review/content/01a9ee61-1e49-462d-842d-1cdf59a5ced6/review
Thanks so very much for the quick response!! I will check it out now.
Working like a charm, thank you once again. Have a great rest of the day.
Hello again, found an issue that prevents this from working. If there is another javascript attached to another trigger on the same slide, it stops working, any ideas? Thanks
I suppose it depends upon what the script is doing. All this script does is setup a mutation observer (event handler) that watches for changes to the value of the input box. When the string changes length, the counter text is updated. The script on the second slide disconnects the observer, since it is no longer needed. Can you post the .story file you have an issue with? If not, at least a link to the published Review 360 demo and the script text would be helpful.