2

We are working to make our application as accessible as possible. We need to allow customers to keep their hands on the keyboard and tab all the way through the application. We are using angular-ui/bootstrap horizontal navset tabs to display and collect data within each tab-panel. Currently we cannot find a non-mouse way to get focus from the tabs down into the tab-panel to allow focus on select-able components.

Is the tabset built for view-only content? If not, how do we get focus down to editable / select-able components in the tab-panels?

HTML:

<tabset>
  <tab tab-index=1>
    <tab-heading>
      <span>hello</span><em>1</em>
    </tab-heading>
    One

    <input type="button" value="test" tabindex="2">
    </tab>
  <tab heading="Two" tab-index=1>Two</tab>
  <tab heading="Three" tab-index=1>Three</tab>
</tabset>

JS:

angular.module('ui.bootstrap.demo', ['ui.bootstrap']); angular.module('ui.bootstrap.demo').controller('test', function ($scope) { });

E. Hill
  • 21
  • 3

0 Answers0