Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Radio buttons group with additional text input (tab order)

Avatar

Level 1

I am using LiveCycle Designer ES 8.2.1 on Windows XP.

I have a form with a series of radio buttons. Certain options (e.g. "other"), if selected, require an additional text input. Since radio button lists are treated as one item in the tab order, I have not yet found a way to set the tab order so that the related text input immediately follows the radio button, e.g.:

Favorite color:

o Blue    (please specify shade: __________)

o Green

o Red

o Other   (please specify: __________)

I am considering changing the radio buttons to checkboxes to better facilitate this. However, if there is a way to detect that a certain radio button has been selected and advance the user directly to the associated text input, or if it has not been selected, skip the associated text input entirely, that would be ideal. (Radio buttons are also desirable in this case because the custom screen reader text for the radio button list is announced before each option when a screen reader or the read out loud function of Acrobat Reader is used--the checkboxes appear to require additional screen reader text for each option.)

The form is to be static and printed, whether filled out on a computer or by hand, so all options need to be present and visible.

Thanks in advance for any suggestions.

3 Replies

Avatar

Level 10

The attached uses xfa.host.setFocus() to control the tab order in and out of the exclusion group.

Steve

Avatar

Level 1

Thanks, Steve. The example was very helpful. It does produce some unusual behavior, though.

Example 1:

Select Green with the mouse. Select Blue with the mouse.

Result: Blue is not selected, and now Red has focus (not blueShade).

Example 2:

Select Green using the arrow keys. Select Blue with the arrow keys.

Result: Blue is selected, but Red has focus (not blueShade).

I understand why that is happening--the user exits Green, which sets the focus to Red (although I'm less clear as to why, in the first example, Blue is not selected).

I worked on some Javascript that would, for every radio button, evaluate the selected option from the radio button list, check to see if it had an associated "specify" text input, and set the focus to that element if it is blank, and otherwise advance to the next radio button. However, this still has some of the same unexpected (to the user) behaviors if the user changes his or her initial selection.

Since the form I am working on will probably be updated annually and not necessarily by me, I am going to convert the radio button lists to checkboxes. I think the tab-order will make much more sense that way without any scripting.

Thanks for your help.

Avatar

Level 10

Good plan. Less script is always better.

Steve