jQuery: Disable Closing of Modal in Bootstrap

Bootstrap's Modal default behavior is that it closes when you click outside the window. To disable it, Bootstrap, provided simple solution:

With jQuery

You can initialize the modal settings backdrop property to "static"

$('#myModal').modal({
  backdrop: 'static',
  keyboard: false
});

You may noticed that we also set keyboard property to false. This is to disable the use of ESC button to close the modal.


Though I would recommend this only as alternative. It is still preferred to use HTML and Bootstrap has just made it possible.

Use backdrop data attribute

According to Boostrap, if you set data-backdrop to "static", this will disable the modal from closing.

<a data-controls-modal="#yourId" data-backdrop="static" data-keyboard="false" href="#">