Forum Discussion

ClaudiaGlase's avatar
ClaudiaGlase
Community Member
19 days ago

Help for interaction in text insert field

Hello, 

in storyline I am creating a test to call up knowledge learned in a rise E-Learning before. 

In one case the user should input 4 digits (1 Letter and 3 numbers) in an insert field. The first digit should open Level 1 when it is correct, the next digits Level 2 and so on.

The jump to the level should happen without confirmation like click on a button oder use enter. That means every keystroke should cause an (other) action.

I didn't find a discussion yet. So I hope somebody can help. 

Greeting 

Claudia

  • Nedim's avatar
    Nedim
    Community Member

    Hi Claudia,

    Here is another one for you.

    The input is validated and limited to 4 characters. The first character must be correct (for example, a specific letter like 'B'). If the first character is correct, the first level is unlocked, and the user can proceed to type the second character. If the first character is incorrect, the user cannot proceed. Once the first character is correct and the first level is unlocked, the second character, which must also be correct (e.g., '2'), can be typed. If the second character is correct, the second level is unlocked. If the second character is incorrect, the user cannot proceed. When the first two characters are correct, the third character (e.g., '4') can be typed, and if it’s correct, the third level is unlocked. If any of the previous characters are incorrect, the user cannot proceed. Finally, once the first three characters are correct, the user can type the fourth character (e.g., '6'). If the fourth character is correct, the fourth level is unlocked. If any characters are deleted, all levels are locked again, and the user will need to re-enter the correct sequence to unlock them once more. Or you can simply disable text entry once the correct combination is entered and the fourth character is correct.

    • ClaudiaGlase's avatar
      ClaudiaGlase
      Community Member

      Hi Nedim, thank you for your answer, too.

      Do you also use javascript? Perhaps I make a mistake but I cannot copy your idea to involve it in my story. Could you send me a story-file?

      • Nedim's avatar
        Nedim
        Community Member

        Yes, I use JavaScript to enhance the text entry field functionality. Specifically, I limit the maximum allowed characters to 1 initially and then increase the limit by 1 for each correctly typed character, up to a maximum of 4 characters.

        Additionally, JavaScript allows me to update the text entry value in real-time as the user types, rather than waiting for the field to lose focus. While it's possible to achieve this functionality without JavaScript, it would be more complex and less user-friendly. Without JavaScript, the user would need to click outside the text entry field to trigger validation and update the value after each character is entered.

        I also use Storyline True/False variables (e.g., Level1, Level2, etc.) For each correctly typed character, I set the corresponding variable to True in my JavaScript code. Based on the values of these variables, I unlock the level buttons accordingly.

        The implementation might be a bit complex and could definitely be simplified with less code if needed. My main goal is to ensure that all levels are unlocked if the user types all characters correctly. However, if the user enters an incorrect character, the levels are immediately locked again.

        I've attached my .story file.
        Let me know if you need further assistance with adjusting the code.

    • ClaudiaGlase's avatar
      ClaudiaGlase
      Community Member

      Thank you for your answer Nathan_Hilliard.

      Is isn't a problem I need to copy it four times to check every digit?

      • Nathan_Hilliard's avatar
        Nathan_Hilliard
        Community Member

        The script updates a value called inputBoxValue as the user types. To do something when a specific value ha sbeen typed, just create one or more triggers to watch that variable for changes. For example, if your target code is A1234, create triggers similar to this:

        Do something   (like open a layer)
            When inputBoxValue changes
                if inputBoxValue = value A1   (or A12 or A123, etc.)
                    Else do something else   (if needed)

        If you are just showing layers or opening a lightbox, then you can continue to return to this same text input box. If you need to navigate away from this slide and resume checking on another different slide, then yes you would need to include the script trigger that fires when the user clicks the text entry. Just include whatever trigger matches you need for inputBoxValue on that new slide.