Setting focus to text entry box in Storyline
Dec 19, 2012
Hi. I think I know the answer to this, but I need to ask to make sure. I'm updating a simulation of a mainframe data system, originally recorded in Captivate six years ago. To correctly mimic the system, I need the focus of the screen to be on the text entry box from when the timeline for the slide starts, so that the student can input the data without clicking on the text entry box. In searching the forums, I found a similar query regarding Quizmaker, and this functionality was not supported in that program. I'm guessing that Storyline won't support it either.
90 Replies
Are there any updates on this? I also would like to be able to set the text entry to be on focus at the start of the slide, and the technique of putting it at the bottom of the timeline list isn't working in 360.
Hi Mary,
Thanks for checking in. We're doing some final testing on this fix, but I expect it to be available in the next update to Storyline 360 which will be soon!
We'll post here once that is ready.
Hey folks! I'm happy to let you know that we just released Update 12 for Storyline 360, and you can check out the new features and fixes here!
Specifically included in this version is a fix to address some issues with data entry fields:
Simply update Storyline to the latest version and republish your project to see the fix. Here's how updating Storyline 360 works.
I'm happy to hear how you make out!
This post was removed by the author
Hi Ephraim,
Thanks for sharing your file with me! I tested it in Internet Explorer, and I didn't have any issues typing in the text entry fields. Here's a screen recording of my testing.
Could you test this link in Internet Explorer and let me know if you are able to type in the text entry fields?
Thanks!
Hi Alyssa,
Thanks for replying. That does indeed work, how very odd! And very good to know.
I was testing in Articulate Review. It didn't occur to me that Review might be interfering with the keyboard focus, since it didn't interfere in Chrome or Firefox. Clearly, that's what is happening here. You can see the interference in action here:
https://360.articulate.com/review/content/f2c6519b-81f2-4513-b6b9-a6421e519bbb/review
Thanks again for your help -- when using this type of trick in the future I'll test outside of Review.
Good catch, Ephraim! I'm glad we could put our heads together to get this sorted out.
I'll do some further testing in Internet Explorer with Articulate Review, since that behavior seems a bit buggy. Thanks for pointing that out to us!
Should a data entry field be at the top of the timeline, or at the bottom for this automatic focus to work. I have the latest version of Storyline 360 installed and some of my slides allow immediate input, and some seem to require 2-3 clicks before the user can enter data. I need them to be able to click once and input data. I'm on a Windows 10 machine.
Hi to everyone - I hope this thread is still alive.
The tips above - (1) putting the background on a slide master, and (2) moving the text entry box to the bottom of the timeline - so that the focus of the screen is on the text entry box from when the timeline for the slide starts, enabling the student to input the data without clicking on the text entry box are great tips and they work fine for me. However, . . .
If the user enters the wrong string, I present them with a feedback layer that says "Wrong text" and has them click OK, which hides the incorrect layer and in effect sends them back to the base layer. But once that happens, the focus/cursor is no longer at the beginning of the text entry field; the user has to click in the text entry box in order to enter the correct text. This would not happen in the actual system that I am trying to mimic - it would give them an error message but put their cursor back to the beginning of the field.
Does anyone know of a solution where an incorrect entry (followed by incorrect layer feedback, where I also clear the text entry by setting it to blank, thus removing their incorrect text string) will put the cursor back to the beginning of the text entry box?
I hope I have explained that well enough. Any pointers would be welcome.
Thank you!
Hi Stuart,
Instead of using a layer, could you use a new slide? That slide trigger when they answered incorrectly could be to "Jump to slide (previous slide)" and if the slide properties are set to "reset to initial state" that should allow your text entry setup to take focus.
Hope that helps, and if you're still stuck share a copy of your .story file here with us so that folks in the community can take a look and offer other ideas!
You know, that's not a bad solution Ashley. Thanks very much. It isn't ideal - I'd much rather Storyline take care of it than for me to have to create a new slide for each one of my text entry interactions - but it ain't bad.
Thank you very much. Problem solved.
Thanks, Ashley,
I did try using the text box click to a new page action on this during my initial attempts. I hadn't adjusted the slide properties this way, though, and all it did was set up another click requirement prior to doing the text entry. This was another step away from the reality I was attempting to simulate. I ended up reverting to Captivate, for this project which meant starting all over again because I couldn't extract my images from Storyline. I'll take another shot at it when I get a chance.
Kind Regards,
Michele
Keep us posted on your future projects, Michele! If there's a way we can make it work in Storyline, we want to help you achieve it. 🌟
Great that Storyline 365 has an update that addresses some of the challenges of setting where the focus appears on a slide - will the same functionality be included in Storyline 3
what about mobile stories where there is no Tab button to press - anyone have a recommendation for moving easily between input boxes (text or numeric) - I have 3 numeric input boxes and would like the focus to start in one then move when the enter key pressed
Hi Leslie!
Back in March 2018, we released Update 3 for Storyline 3. In that release, we included a fix for this issue: Data-entry fields didn't have focus when slides loaded in HTML5 output, so learners had to click inside them before entering text.
It sounds like you've got more than one text entry field on a slide, and you want learners to input text on a mobile device. Learners will need to tap each field to type in the input boxes, since there isn't a way to automatically move from one field to another.
Thanks for your reply - I fully agree with your comments - still learning/playing with Storyline - have created a single input box to resolve the issue of multiple input boxes and eliminate the challenge with iPad input
Sent from my iPhone
Happy to hear that worked for you, Leslie!
If you need anything else as you continue to learn the ins and outs of Storyline, we'll be here! 😀
It looks like this is now a problem when viewing the course in Chrome. And it seems spotty since it worked in my same course previously. This time, in both Review and a local web publish, a bunch of text fields don't get the flashing cursor. I opened the web version in IE and they all worked.
What appears to be happening is that the text field itself isn't present at all. I can't click into it to enter text.
Is there a fix to have this work in other browsers?
HI Amy,
I tested a course I had handy, and I'm still seeing the flashing cursor while viewing it in Chrome. Can you let me know what version of Chrome you're using and what update of Storyline 360 you published it with?
I just installed the most current SL. I had installed the previous version but had to revert because courses in flight wouldn't publish. I am glad to see that this issue as well as the disappearing objects are now fixed. Thanks! :-)
Glad to hear it, Amy. Thanks for popping back in with an update.
Has anything more been done so a text box can be assigned focus? I understand the proposed solutions, but I'm hoping there's another way.
If you are using Fill-in-the-blanks slides
My colleague wrote a piece of JavaScript for me that focuses directly on the text entry field. Note that this works if you have a single TextEntry field on a fill in the blanks question slide, I do not know if it works for NumericEntry.
setTimeout(function(){
var inputs = document.querySelectorAll('.shown input[type=text][role=presentation]');
console.log('n',inputs.length)
if(inputs.length) inputs[inputs.length-1].focus();
}, 90)
I put it in the trigger 'Execute Javascript when timeline starts on TextEntry'.
Thanks Antje! That worked well. :)
I know that this may be an old topic, but I just had a need to do this, so I went back to my old notes to see how I got it to work. You don't have to put your elements on a master slide. Put them in the slide like you would any other slide.
To get the text box to receive focus, place the text box on a layer by itself. When you want to activate the text box, just activate the layer where it lives.
You can do it when the slide starts by setting a trigger to activate the layer when the timeline starts. You can then place anything that you want on the base layer, and the text box will receive focus when the layer that contains it is activated.