Ionic 3 Tabindex issue

Ionic Framework ionic-v3
1

I have a page that is using ionic’s slides. Each slide is its own component.

I am having an issue where when a user presses tab (or uses the arrows above the keyboard in iOS) they can skip to the element on a different slide even if I use tabindex="-1".

Is there a way to prevent tabbing to ionic components?

More specifically I am using ion-item that has an ion-radio with an ion-label. Another slide has ion-input and ion-toggle.

I am open to prevent tabbing all together or just to specific elements.

1 Like
2

Hi James,

We were working on something very similar and faced the same issue. The attribute tabindex does not get applied to the native input element within ion-input or other ion elements. We separated each slide into a separate formGroup. We set the disabled attribute of the elements in the other slides to true when the formGroup in the previous slide is invalid. As the element is disabled, users cannot tab to those elements.

1 Like