Issue: I have a page full of survey questions, which basically wraps
10 of these little snippets in a VBox:
<mx:VBox width="100%" styleName="BubbleVBox">
<mx:Text width="648" styleName="bodyText">
<mx:text>1. FirstQuestion</mx:text>
</mx:Text>
<mx:RadioButtonGroup id="q1"/>
<mx:VBox paddingLeft="40">
<mx:RadioButton group="{q1}" id="q1a" value="A" label="A. Very
good"
tabIndex="22" />
<mx:RadioButton group="{q1}" id="q1b" value="B" label="B.
Good"/>
<mx:RadioButton group="{q1}" id="q1c" value="C" label="C. Bad"/>
<mx:RadioButton group="{q1}" id="q1d" value="D" label="D. Very
Bad"/>
</mx:VBox>
</mx:VBox>
So you have 10 RadioButtonGroups grouping 4 Radio Buttons each (40
buttons total).
To round out the page, I have 5 more checkboxes, and a button for
submitting.
When you try controlling focus with the keyboard: Tab goes to the
first Radio Button, 2nd tab skips all 39 other buttons and moves to
the first checkbox.
If you shift tab after that, it will move to the last radio button,
and shift-tab fine all the way back up the page.
I've tried multiple means of controlling this order: Adding tabIndex
to all objects (both including and excluding all containers), adding
tabIndex to only the first item in each RadioButtonGroup. Nothing's
working.
Am I missing something simple? The only examples of this issue are on
list and recommend using Flex 3 (which I already am) or not using
RadioButtons and controlling focus in AS.
Suggestions?