Menu
I am using 2 modals, 1st one contains a form and 2nd shows up when an error occurs in the form. 2nd modal contains only text with error message.
My problem is that when 2nd modal show up and I press Esc, the first one (with the form) will close instead on the 2nd one.
Is there any way how to focus the 2nd modal when it shows up?
This is how it looks like, now if I pressed Esc, the 1st one would close, but I want to close the 2nd one first.
UPDATE
Once I click somewhere on the 2nd modal, it works perfectly. I just need to select/focus it automatically
460
Clicking on the modal “backdrop” will automatically close the modal. Bootstrap only supports one modal window at a time.
Modal Options This modal can be closed with the escape key on your keyboard. Note: You need to press the tab key on the keyboard to first enter the modal window, and then press the Esc key.
To close the modal, simply call the handleClose() function inside the onLoginFormSubmit() function body.
If you want to prevent boostrap modal from closing by those actions, you need to change the value of backdrop and keyboard configuration. The default value of backdrop and keyboard is set to true . You can change the configuration in HTML or Javascript directly.
It looks like this is an issue with how the keyup event is being bound.
You can add the "tabindex"attribute to your modal to get around this issue:
tabindex="-1"
So your full code should look like this:
<a href="#my-modal" data-keyboard="true" data-toggle="modal">Open Modal</a>
<div class='modal fade hide' id='my-modal' tabindex='-1'>
<div class='modal-body'>
<div>Test</div>
</div>
For more info you can view the discussion on this issue on github: https://github.com/twitter/bootstrap/issues/4663
75
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
