Forum Discussion

StefanieKirs743's avatar
StefanieKirs743
Community Member
21 days ago

Text Entry-Three Fields

Hello community,

I need help with this project I am working on. It requires a login page (attached) that contains a keypad. The goal is for the user to click the numbers on the keypad and fill in each field in order.

Here's what I want to happen:

  1. The user starts with the Driver ID field and inserts the appropriate credentials
  2. After clicking a button (or just clicking in the box), jump to the Tractor Number field and insert appropriate credentials
  3. After clicking a button (or in the box), jump to the DC ID field and insert appropriate credentials.
  4. Then I want the user to click a button when their login is completed.  
  5. Step 4 should lead the user to the "Activity Correct" layer. User should be able to click the "Sign In" hotspot in the "Activity Correct" layer to move on to the next step or receive an incorrect layer if they entered something wrong. There also needs to be an "if" condition so they can't move to the next slide unless all the fields = the correct credentials.

I am able to click the numbers on the keypad to put the Driver ID in, but the numbers won't appear on the other two fields. 

I have already tried the following: 

  • making them into layers
  • inserting multiple keypad layers
  • putting in three different buttons and changing their states
  • moving my triggers around from the keypad layer to the base layer and back
  • moving the buttons from the keypad layer to the base layer and back

Can someone please look at my project and help me figure out what I am doing wrong? Bonus points if you have an example project with something exactly like this :) 

If this isn't possible to do, alternative suggestions are very, very appreciated!

advice
Articulate 360
e-learning development
Instructional Design
storyline 360
  • JesseWu's avatar
    JesseWu
    20 days ago

    I played around and found out: there is a curly bracket missing at the end of your numpad scripts. Any script error will disable all scripts from working. 

    var player = GetPlayer();
    var DCID_Ongoing = player.GetVar("DCID_Ongoing");
    var DCIDInput = player.GetVar("DCIDInput");
    var DriverID_Ongoing = player.GetVar("DriverID_Ongoing");
    var DriverIDInput = player.GetVar("DriverIDInput");
    var TractorNum_Ongoing = player.GetVar("TractorNum_Ongoing");
    var TractorNumInput = player.GetVar("TractorNumInput");

    if (DCID_Ongoing == true) {
        DCIDInput += "0";
        player.SetVar("DCIDInput", DCIDInput);
    } else if (DriverID_Ongoing == true) {
        DriverIDInput += "0";
        player.SetVar("DriverIDInput", DriverIDInput);
    } else if (TractorNum_Ongoing == true) {
        TractorNumInput += "0";
        player.SetVar("TractorNumInput", TractorNumInput);
    } //<-- This is the bracket you missed.

    For your testing, disable all other scripts. Fix one of them. If it works, copy to and enable others back on. Inspect the console on the preview panel helps you figure out what could be wrong :) 

    Once they are all set, you can add your original backspace and clear buttons back. I didn't try them because I am lazy. It just changes one line of code.

  • JesseWu's avatar
    JesseWu
    Community Member
    20 days ago

    Hello,

    Based on your user story, I tried a solution on another page:

    (1) Add 3 True/False variables to monitor which input element our user is focusing on. When user is focusing on A, make monitor on B and C false, and so on.

    These monitors will be triggered by both: user manually click on next field or use "next" button.

    (2) With the monitors, the shared keypad now will append characters to the only active input variable. I only coded for 4 buttons for the test reason, but it works as I expect when I input with clicking keypads only or mixing keypad with keyboard.

    (3) Button "verification" will check inputs and show slides as desired. 

    I didn't delete my testing references. I hope it makes it easier for you to catch some thoughts.

    Bug: because of how I coded, when you tried to change a number in the middle, like "2" in 123 to 143, the numpad won't do, getting you a 1234 instead, because it is not designed to follow users' cursor.

     

     

    • StefanieKirs743's avatar
      StefanieKirs743
      Community Member
      20 days ago

      Hi Jesse, 

      Thank you SO much! This is genius! I got started based on your example, and despite doing it the exact same way, my numbers won't appear. Can you look at this updated one and see what I'm missing?

      • JesseWu's avatar
        JesseWu
        Community Member
        20 days ago

        I played around and found out: there is a curly bracket missing at the end of your numpad scripts. Any script error will disable all scripts from working. 

        var player = GetPlayer();
        var DCID_Ongoing = player.GetVar("DCID_Ongoing");
        var DCIDInput = player.GetVar("DCIDInput");
        var DriverID_Ongoing = player.GetVar("DriverID_Ongoing");
        var DriverIDInput = player.GetVar("DriverIDInput");
        var TractorNum_Ongoing = player.GetVar("TractorNum_Ongoing");
        var TractorNumInput = player.GetVar("TractorNumInput");

        if (DCID_Ongoing == true) {
            DCIDInput += "0";
            player.SetVar("DCIDInput", DCIDInput);
        } else if (DriverID_Ongoing == true) {
            DriverIDInput += "0";
            player.SetVar("DriverIDInput", DriverIDInput);
        } else if (TractorNum_Ongoing == true) {
            TractorNumInput += "0";
            player.SetVar("TractorNumInput", TractorNumInput);
        } //<-- This is the bracket you missed.

        For your testing, disable all other scripts. Fix one of them. If it works, copy to and enable others back on. Inspect the console on the preview panel helps you figure out what could be wrong :) 

        Once they are all set, you can add your original backspace and clear buttons back. I didn't try them because I am lazy. It just changes one line of code.

Related Content