angular js: Prevent Bootstrap Modal from disappearing when clicking outside or pressing escape?

Question

Am using the angular bootstrap to present a modal. But my requirement is to prevent pop-up dismissal when clicking outside the modal, or when the escape key is pressed.

I followed the tutorial on the angular bootstrap site :http://angular-ui.github.io/bootstrap/

Answer 1

Use:

backdrop: 'static' 

backdrop - controls presence of a backdrop. Allowed values: true (default), false (no backdrop), 'static' - backdrop is present but modal window is not closed when clicking outside of the modal window.

For example:

$modal.open({       templateUrl: 'myModalContent.html',       controller: ModalInstanceCtrl,       backdrop: 'static'     }) 

Answer 2

Add both backdrop: static and keyboard: false to your modal options. The first one disables the background click, the second one the escape key.

backdrop: 'static' - backdrop is present but modal window is not closed when clicking outside of the modal window.

keyboard - indicates whether the dialog should be closable by hitting the ESC key, defaults to true.

Example:

$modal.open({   templateUrl: 'template.html',   controller: TheController,   backdrop: 'static',   keyboard: false }) 

See the docs for more information.