Change Text Entry Variable without control losing focus?

Hello! Does anyone know if there's some way to make this code work if there are multiple text input fields? If I have 4 text input fields, for example, it only seems to listen to the first one.

Array.from(document.querySelectorAll('.acc-textinput')).forEach(el => {
    el.ariaHidden = 'true';
    el.addEventListener('keyup', () => {
        el.blur();
        el.focus();
    })
});

There may be a way to amend the code to take that into account—see above. Setting an element's attribute to 'aria-hidden="true"' should prevent screen readers from announcing anything relating to that element. 

I don't know exactly how Storyline is set up for screenreaders so the above may/may not work. It's worth a try. 

Let us know how you get on.

You can remove the tag inside storyline but that would then break the interaction for anyone using a screen reader

A lot of the stuff I sued to do I cannot now do because of accessibility, I do think accessibility should be a high priority for all courses nowadays.

Hi Glenda,

Yep, I understand the case-sensitivity for the the variables. Beyond that, a few issues I'm getting caught up on:

1) Wouldn't you exclude the double quotes around searchentry in player.SetVar?
2) What is triggering player.SetVar? If the execute javascript action is triggered at timeline start, what is then actually causing it to write to SearchEntry?
3) Conceptually, what is the code actually doing? It looks like you're hoping that Array.from is capturing text input, more than just doing blur/focus. Then you create a variable called "searchentry" and set it to "SearchEntry" - which would be blank, right? Why bother? Then you immediately set searchentry to constituent items 2,3,&4 that you're expecting to be captured in Array. Then you output that back out to SearchEntry. If that all worked, wouldn't it just be setting whatever you type in a text input field to SearchEntry? Why not just set the text variable on the input box to SearchEntry? And then once you have data in SearchEntry, how do you use that to search?

In any case, I can't get the code to work.

I think a custom search feature would be super cool! Appreciate any time you're willing to take to help me understand!

Curtis

You are correct about the double quotes around searchentry in player.SetVar. I edited my post to reflect that.

I was building on Gavin’s excellent work and don’t pretend to understand how his code works. I am certainly not a JavaScript expert. There is probably a more elegant solution. I am creating a software simulation and simply wanted to capture the first few letters of the entry in real-time to trigger a state change from the search page to search results.  For my needs, it doesn’t actually need to work.

Perhaps Gavin or one of the many other JavaScript experts could help you do what you want. I agree - a custom search feature would be super cool! Sorry I couldn’t be of more help.