¿Puede el diálogo modal de bootstrap superponerse a otro diálogo?

Solución:

Escribí una publicación de blog sobre cómo resolver este problema de apilamiento mediante programación: http://gurde.com/stacked-bootstrap-modals/

$(document)  
  .on('show.bs.modal', '.modal', function(event) {
    $(this).appendTo($('body'));
  })
  .on('shown.bs.modal', '.modal.in', function(event) {
    setModalsAndBackdropsOrder();
  })
  .on('hidden.bs.modal', '.modal', function(event) {
    setModalsAndBackdropsOrder();
  });

function setModalsAndBackdropsOrder() {  
  var modalZIndex = 1040;
  $('.modal.in').each(function(index) {
    var $modal = $(this);
    modalZIndex++;
    $modal.css('zIndex', modalZIndex);
    $modal.next('.modal-backdrop.in').addClass('hidden').css('zIndex', modalZIndex - 1);
});
  $('.modal.in:visible:last').focus().next('.modal-backdrop.in').removeClass('hidden');
}

Creo que el fondo modal (superposición) es compartido por todos los modales en BODY.

Pero, puede usar el evento ‘show’ del segundo modal para cambiar la opacidad en el primer modal, dando el efecto de superposición sobre el primer modal:

$('#myModal2').on('show', function() {
    $('#myModal').css('opacity', .5);
});

Manifestación: http://bootply.com/61322

EDITAR:

Si desea deshabilitar el modal 1 mientras el modal 2 está abierto, puede desvincular el modal 1 cuando se abre el modal 2 y luego restaurar el modal 1 cuando se cierra el modal 1. Actualicé Bootply para esto.

$('#myModal2').on('show', function() {
    $('#myModal').css('opacity', .5);
    $('#myModal').unbind();
});
$('#myModal2').on('hidden', function() {
    $('#myModal').css('opacity', 1);
    $('#myModal').removeData("modal").modal({});
});

---

---

Utiliza Nuestro Buscador