bootstrap modal not closing on "esc"

Question

I have a regular bootstrap 3 modal:

div id="test_modal" class="modal animated fade" role="dialog" data-keyboard="true" tabindex="-1"

But on keyboard ESC it only works after clicked once inside the modal, just hitting "esc" lets the cursor disappear, only coming back on "click".

Anyone can explain that to me and advise?

Thanks

Answer 1

Per Bootstrap 3 Modal docs:

Due to how HTML5 defines its semantics, the autofocus HTML attribute has no effect in Bootstrap modals. To achieve the same effect, use some custom JavaScript:

$('#myModal').on('shown.bs.modal', function () {
  $('#myInput').focus()
})