How to stop tabbing to elements outside Angular-UI Bootstrap modal window?

Question

When I open modal in Angular-UI Bootstrap, press the 'tab' key to cycle through elements, once cycling through elements in the modal window it starts selecting elements behind the modal.

To demonstrate goto: http://angular-ui.github.io/bootstrap/ and scroll to the modal section.

Angular-UI bootstrap is built up from Twitter Bootstrap. Though Twitter Bootstrap does not have this same issue. I have tested in 3.1.1 & 3.2

To demonstrate desired behaviour: - 3.2: http://getbootstrap.com/javascript/#modals - 3.1.1: http://bootstrapdocs.com/v3.1.1/docs/javascript/#modals

How does Bootstrap prevent selecting elements behind the Modal window on tab?

Answer 1

My guess is that this PR for angular-ui will fix your problem. It looks like the PR is stuck because the commits need to be squashed. This might be something that you could do if you want to push this forward and get the fix in.