prevent bootstrap modal from closing when clicking outside or escape

This article explains how to prevent bootstrap modal from closing/disappearing when clicking outside or escape.

This can be done in two ways

1. Through JavaScript or
2. Through HTML

JavaScript:

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

HTML:

<div id="modalID" class="modal hide fade in" data-keyboard="false" data-backdrop="static">

According to bootstrap documentation

backdrop (Type: boolean|string, Default: true) - Controls presence of a backdrop. Allowed values: true (default), false (no backdrop), 'static'(disables modal closing by click on the backdrop).

keyboard - (Type: boolean, Default: true) - Indicates whether the dialog should be closable by hitting the ESC key.

By passing backdrop option with value 'static' will prevent closing the modal. Also by passing {keyboard: false} we can prevent closing the modal by pressing Esc.

In this way we can prevent the bootstrap modal from closing when clicking outside or escape.

For more posts on bootstrap visit: BootStrap