Forum Discussion
Limiting Text Entry to One Character Issue
Hello everybody!
As I work on a crossword puzzle, I would like to limit the text entry fields to only contain one character.
Previously, in 2023, I have succeeded doing it using the JavaScript code down below, and it worked perfectly. Yet, when I tried to use it again, it doesn't seem to be working. Even when I opened my old project from 2023 and republished it again as a test or previewed in storyline it doesn't work anymore either.
I'm wondering if this is happening because there's some issue with storyline, maybe it has to be done differently now? Does anyone have an idea or have met and overcome the same issue?
Thanks.
Here's the JavaScript code somebody here suggested, that I used in my previous projects :
var elements = document.getElementsByTagName("input");
for (var i = 0, element; element = elements[i++];) {
element.setAttribute('maxlength', 1);
element.setAttribute('autocomplete', 'off');
}
Try
const Inputs = () => { const inputs = document.querySelectorAll('.acc-textinput'); inputs.forEach((input) => { input.setAttribute('maxlength', '1'); input.setAttribute('autocomplete', 'off'); }); } setTimeout(Inputs, 100);
- LesBCommunity Member
Please let me know how I can return the favor. Thanks!
- NedimCommunity Member
Find the attached .story file. Let me know if you need further assistance. Feel free to contact me at my private email address nedim.ramic@gmail.com so we don't clutter this topic. I appreciate your offer to return the favor. I'm here simply to assist and contribute whenever I can. It would be great if you could recommend me or my work to others, as I’m often available for additional projects.
- LesBCommunity Member
Much appreciated! I'll definitely recommend you and return to you if/when I need your service.
I'll move this new topic now. Hopefully it'll be done properly. Enjoy your holidays!!
- NedimCommunity Member
Try
const Inputs = () => { const inputs = document.querySelectorAll('.acc-textinput'); inputs.forEach((input) => { input.setAttribute('maxlength', '1'); input.setAttribute('autocomplete', 'off'); }); } setTimeout(Inputs, 100);
- LesBCommunity Member
I have an advanced developer who is helping me to limit the characters.
He tried this and other suggestions but it only works for 1 entry box on a slide.
I have multiple slides with up to 3 entry boxes on each slide. Suggestions? Thanks
- PeterBeare-a150Community Member
This code was very useful- thanks! - but I also found that it only restricted the first text field on the slide. By replacing the JavaScript arrow function with a traditional function, it now seems to limit all the text-fileds (although the uppercase transform does not work).
function LimitInputs() { const inputs = document.querySelectorAll('.acc-textinput'); inputs.forEach(function(input) { input.setAttribute('maxlength', '1'); input.setAttribute('autocomplete', 'off'); input.style.textTransform = 'uppercase';//doesn't work }); } setTimeout(LimitInputs, 100); LimitInputs();
- Jenny_EDCommunity Member
This worked for me, thank you so much!