Question T5605
Visible to All Users

Tab Order When Next Question Made Visible With VisibleIf

created 4 years ago

We are rebuilding an app which has a "next question id" concept. Namely that I show you one question at a time and then display the next question based on the answer of the previous question. It is a call center app that asks a lot of eligibility questions as Yes/No radio buttons so if you are not eligible on one of the questions, it basically routes you to a message that you are not eligible. But, if you keep answering the correct answers, it shows you the next question. We've mimicked that with the VisibleIf property and having it look at the value of the previous question.

In this particular case, I started off with a couple of text boxes for first and last name and that leading in to a bunch of radio buttons. The first name textbox starts off visible along with the Complete button. I type in the name and then hit tab. As I'm looking at the first name being nonempty, the last name textbox is then displayed. But, the tab order has jumped to the Complete button and THEN it showed the last name. I have to Shift-Tab to get the focus back into the last name box which is now visible.

In contrast, with the radio buttons, I can use the arrow keys to switch between the Yes and No values. As only one of those values is the "right" one, it toggles the visibility of the next question. Since I'm not having to tab first before the next question becomes visible, it does not jump over it.

So, is there a way to control the focus when a question (especially the textbox) is made visible? Or to make that new question have the focus?

Also, is there a way to focus the cursor in the first textbox when the survey renders? I've tried both focusFirstQuestion and focusFirstQuestionAutomatic. These seem to scroll the questions up to the top, but it doesn't put the focus in the textbox to start off with.

Answers approved by surveyjs Support

created 4 years ago

Hello Mike,
To solve your issue you can set survey.textUpdateMode to "onTyping".

Thank you,
Andrew
SurveyJS Team

    Other Answers

    created 4 years ago

    Thank you. That did the trick. I thought I had looked through the docs well, but I overlooked this setting.

    Regarding the focus first question, is that supposed to put the cursor in the text box if I've got a text question as the first question?

      Comments (1)

        Hello Mike,
        We have a correct tab-order. The issue you had is that the focus changed and focus moved to "Complete" button before the invisible question becomes visible.

        Thank you,
        Andrew
        SurveyJS Team