Why tabindex='-1' prevents keyboard

Question

After many hours trying to locate why a keyboard input would not work within a bootstrap modal, i have finally managed to identify the issue.. and it was something i would have never of thought of, but found it by pure process of elimination.

By having tabindex='-1' present on the <div> for the modal from bootstrap, it completely stops the input from the keyboard. I would have thought the data-attribute data-keyboard="false" would have been the culprit however it was not.

My Question Why does tabindex='-1' prevent keyboard input. And what would be its purpose other than that?

Answer 1

tabindex sets the order that editable-elements on the page will be iterated using the tab key. -1 seems like a reasonable value, from that sense, to make an element unapproachable.

For more information: http://webaim.org/techniques/keyboard/tabindex