Archive

Posts Tagged ‘Disable click outside of bootstrap model’

Disable click outside of bootstrap model area to close modal


Problem :You can close the modal by clicking on the background. Is there anyway to disable this feature? On specific modals only?

Solution :

There is option called backdrop. Passing this option with value 'static' will prevent closing the modal.
Also can pass {keyboard: false} to prevent closing the modal by pressing Esc.

[1] If you opening the modal by js use:
$
('#myModal').modal({backdrop: 'static', keyboard: false})

[2] If you are using data attributes, use:
<button data-target="#myModal" data-toggle="modal" data-backdrop="static" data-keyboard="false">
    Launch demo modal
</button>`