Vincula una función a Twitter Bootstrap Modal Close

Estoy usando la biblioteca de Bootstrap de Twitter en un nuevo proyecto y quiero que parte de la página se actualice y recupere los últimos datos json en el cierre modal. No veo esto en ninguna parte de la documentación, ¿alguien puede señalarme o sugerir una solución?

Dos problemas con el uso de los métodos documentados.

 $('#my-modal').bind('hide', function () {
   // do something ...
 });

Adjunto una clase "hide" al modal ya para que no se muestre en la carga de la página, por lo que se cargaría dos veces

incluso si elimino la clase hide y configuro la identificación del elemento display:noney la agrego console.log("THE MODAL CLOSED");a la función anterior cuando presiono cerrar, no sucede nada.

Bootstrap 3 y 4

$('#myModal').on('hidden.bs.modal', function () {
    // do something…
});

Bootstrap 3: getbootstrap.com/javascript/#modals-events

Bootstrap 4: getbootstrap.com/docs/4.1/components/modal/#events

Bootstrap 2.3.2

$('#myModal').on('hidden', function () {
    // do something…
});

Ver getbootstrap.com/2.3.2/javascript.html#modals → Eventos

Bootstrap 4

$('#my-modal').on('hidden.bs.modal', function () {
  window.alert('hidden event fired!');
});

Vea este JSFiddle para un ejemplo de trabajo:

https://jsfiddle.net/6n7bg2c9/

Vea la sección de eventos modales de los documentos aquí:

https://getbootstrap.com/docs/4.3/components/modal/#events

Al iniciar Bootstrap 3 ( editar: sigue siendo el mismo en Bootstrap 4 ) hay 2 instancias en las que puede iniciar eventos, siendo:

1. Cuando comienza el evento modal "hide"

$('#myModal').on('hide.bs.modal', function () { 
    console.log('Fired at start of hide event!');
});  

2. Cuando finaliza el evento modal "ocultar"

$('#myModal').on('hidden.bs.modal', function () {
    console.log('Fired when hide event has finished!');
});

Ref: http://getbootstrap.com/javascript/#js-events

En lugar de "en vivo" debe usar el evento "on", pero asignarlo al objeto del documento:

Utilizar:

$(document).on('hidden.bs.modal', '#Control_id', function (event) {
// code to run on closing
});

$(document.body).on('hidden.bs.modal', function () {
    $('#myModal').removeData('bs.modal')
});

Bootstrap proporciona eventos que puede enganchar en modal , como si deseaactivarun evento cuando el modal ha terminado de ocultarse para el usuario, puede usar elevento hidden.bs.modal como este

    /* hidden.bs.modal event example */
    $('#myModal').on('hidden.bs.modal', function () {
          window.alert('hidden event fired!');
    })

Verifique un violín de trabajo aquí. Lea más sobre métodos modales y eventos aquí en Documentación.

Bootstrap 4:

$('#myModal').on('hidden.bs.modal', function (e) {
   // call your method
})

hide.bs.modal : este evento se activa inmediatamente cuando se llama al método de instancia de hide.

hidden.bs.modal : este evento se activa cuando el modal ha terminado de ocultarse al usuario (esperará a que se completen las transiciones CSS).

Lo haría así:

$('body').on('hidden.bs.modal', '#myModal', function(){ //this call your method });

El resto ya ha sido escrito por otros. También recomiendo leer la documentación: jquery - en el método

He visto muchas respuestas con respecto a los eventos bootstrap, como hide.bs.modalqué se dispara cuando se cierra el modal.

Hay un problema con esos eventos: cualquier ventana emergente en el modal (popovers, información sobre herramientas, etc.) activará ese evento.

Hay otra forma de atrapar el evento cuando se cierra un modal.

$(document).on('hidden','#modal:not(.in)', function(){} );

Bootstrap usa la inclase cuando el modal está abierto. Es muy importante usar el hiddenevento ya que la clase intodavía está definida cuando hidese desencadena el evento .

Esta solución no funcionará en IE8 ya que IE8 no es compatible con el :not()selector Jquery .

Estaba teniendo los mismos problemas que algunos con

$('#myModal').on('hidden.bs.modal', function () {
// do something… })

Debe colocar esto en la parte inferior de la página, y colocarlo en la parte superior nunca activa el evento.

si desea activar una función en cada cierre modal, puede usar este método,

$(document).ready(function (){
    $('.modal').each(function (){
        $(this).on('hidden.bs.modal', function () {
            //fires when evey popup close. Ex. resetModal();
        });
    });
});

Por lo tanto, no necesita especificar identificadores modales cada vez.