Prevent Bootstrap Modal from disappearing when clicking outside or pressing escape? [duplicate]

Answer 1

If you need disable clicking outside but enable pressing escape

$('#myModal').modal({
    backdrop: 'static',   // This disable for click outside event
    keyboard: true        // This for keyboard event
})

Answer 2

<div class="modal show">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">     

    <h4 class="modal-title">Modal title</h4>
     </div>
     <div class="modal-body">
      <p>One fine body&hellip;</p>
  </div>

  </div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->

i think this codepen can help you prevent modal close css and bootstrap

Answer 3

You can Use Direct in bootstrap model also.

<div class="modal fade" id="myModal" data-keyboard="false" data-backdrop="static">

Answer 4

You should use backdrop static , keyboard false. and can use close button off by using jQuery or can remove from modal html. Hope this help.

 $('#MyModal').modal({ backdrop: 'static', keyboard: false });
    $('#MyModal .close').css('display','none');

Answer 5

<button class="btn btn-primary btn-lg" data-backdrop="static" data-keyboard="false" data-target="#myModal" data-toggle="modal">

Answer 6

If you need to setup this after the modal is shown, you can use @Nabid solution. However, sometimes you still need to allow some method to close the modal. Assuming you have a button with class really-close-the-modal, which should really close the modal, you can use this code (jquery):

var closeButtonClicked = false;

$('.really-close-the-modal').on('click', function () {
    closeButtonClicked = true;
});

$('#myModal').on('hide.bs.modal', function (e) {
    if (!closeButtonClicked) {
        e.preventDefault();
        e.stopPropagation();
        return false;
    }
    closeButtonClicked = false;
});

This isn't really nice code design, but it helped me in a situation where the modal was shown with a loader animation, until an ajax request returned, and only then could I know if the modal needed to be configured to prevent "implicit" closing. You can use a similar design to prevent closing the modal while it's still loading.