Tengo un código que lo que quería hacer es cerrar el modal en el éxito de ajax. Este es mi código:
texto
success: function() { console.log("delete success"); $('#deleteContactModal').modal('hide'); $( "#loadContacts" ).load( "/main/loadContacts" ); }html
<div class="modal fade" id="deleteContactModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog modal-sm" role="document"> <div class="modal-content"> <!--everything goes here --> </div> </div> </div> Todo funciona excepto cuando el código $('#deleteContactModal').modal('hide'); activa, solo muestra una pantalla negra descolorida como esta:
El modal se cierra pero el color negro desvanecido sigue presente. ¿Me estoy perdiendo de algo? Gracias de antemano.
Estoy usando bootstrap 3.3 .
intente agregar este atributo con su div modal aria-hidden="true"
p.ej:
<div aria-hidden="true" class="modal fade" id="deleteContactModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">Aquí está mi ejemplo de trabajo
<div class="modal fade" id="copy_course_modal" tabindex="-1" role="dialog" aria-labelledby="copycourse" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="purchaseLabel">Copy Chapter</h4> </div> <div class="modal-body"> Modal body content here </div> <div class="modal-footer"> <button type="button" class="btn btn-primary" onclick="saveCopiedCourse()">Copy Course</button> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div>y en el éxito haciendo lo mismo.
$("#copy_course_modal").modal('hide');Tengo exactamente el mismo problema y la única forma que pude encontrar para trabajar es eliminar individualmente las partes del modal que se está generando. Simplemente coloque esta función en yous js y haga un evento onclick en su botón en su html o js. Espero haber ayudado.
function hideModal(){ $(".modal").removeClass("in"); $(".modal-backdrop").remove(); $('body').removeClass('modal-open'); $('body').css('padding-right', ''); $(".modal").hide(); }Tratar:
$(".modal.in").modal("hide");Esto ocultará el modal actualmente activo.