html – Avoid closing modal when clicking outside of it in bootstrap

Question:

How do I prevent that having a Boostrap modal open and the gray part on the background does not leave the modal window?

Answer:

For bootstrap 3 :

From html :

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

From jQuery :

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

Other data attributes:

|----------------------------------------------------------------------|
|  backdrop   |  Incluye un elemento modal-backdrop. Como alternativa, |
|             |  especifique `static` para un fondo que no cierre el   |
|             |  modal en clic.                                        |
|-------------|--------------------------------------------------------|
|  keyboard   |  Con valor `booleano: true` evita cerra el modal cuando|
|             |  se presiona la tecla `escape`                         |
|-------------|--------------------------------------------------------|
|    show     |  Muestra el modal cuando se inicializa                 |
|-------------|--------------------------------------------------------|
|   remote    |   deprecado desde v3.3.0. Carga desde una vía remota   |
|             |  el contenido del modal                                |
|-------------|--------------------------------------------------------|

Full reference

Scroll to Top