Forum Discussion

WebsterR101's avatar
WebsterR101
Community Member
5 days ago
Solved

Text entry boxes - update value without losing focus

What am I asking? By default, a text entry box in Storyline only saves the entered value to a variable when the text entry box loses focus (so when the learner tabs out, clicks away, etc.) I am loo...
  • Nedim's avatar
    5 days ago

    There are several solutions in the community for this. Instead of forcing the focus to move, we can tell the browser to 'listen' for any input activity within the text box and manually push that value into your Storyline variable in real-time. By using an EventListener, we update the text entry variable directly without the input field ever losing focus. Check the example below:

    const inputField = document.querySelector('.acc-textinput');
    inputField.addEventListener('input', function() {
        let currentVal = inputField.value;
        setVar("userEntry", currentVal);
    });
    // optional input round border
    inputField.style.cssText += "border-radius:50px !important; border:1px solid #fff !important;";