0

https://jsfiddle.net/nrmja871/

if i run this fiddle in IE11 . after press ESC Key the bootstrap modal is closing but not in chrome or firefox. I don't want to close the bootstrap modal using ESC key.

I read in bootstrap documentation(doc.) that we need to add tabIndex='-1' for closing the bootstrap modal using ESC key.

But why it is working in IE without using tabIndex='-1' ?

PS. don't give me solution saying use "data-keyboard", "false" for IE because i have to add this property for every modal :( .

Mahi
  • 1,707
  • 11
  • 22

1 Answers1

0

The best answer I could find is in a discussion I found here about it from the twitter bootstap github. Here's a quote from the conversation:

This seems to be a breaking change in 2.1 as previously the keyup event was bound to the document but now is bound to the actual modal element. Hence, the the tabindex attribute is now required.

So basically when the JQuery library was updated from 2.0.X to 2.1.X the keyup event which was bound to the document element was changed so its now bound to the modal element which caused the escape keyup to not be recognized on some browsers which is why the tabIndex='-1' is now required.

This is how the tabindex helps

A tabindex="-1" value removes the element from the default navigation flow (i.e., a user cannot tab to it), but it allows it to receive programmatic focus, meaning focus can be set to it from a link or with scripting.** This can be very useful for elements that should not be tabbed to, but that may need to have focus set to them.

This quote was taken from this question here which has a great answer if you want to read up more on what the tabindex does. Hope that helps.

Community
  • 1
  • 1
crazymatt
  • 3,266
  • 1
  • 25
  • 41
  • thanks but what to do now for IE ? since still it doesn't required tabIndex='-1' for closing the modal using escape key ? – Mahi Mar 09 '17 at 05:28