Vincular uma função ao Twitter Bootstrap Modal Fechar

Estou usando a lib do Twitter Bootstrap em um novo projeto e quero que parte da página atualize e recupere os dados mais recentes do json no fechamento modal. Não vejo isso em nenhum lugar da documentação. Alguém pode me indicar ou sugerir uma solução.

Dois problemas com o uso dos métodos documentados

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

Eu anexo uma classe "hide" ao modal já, para que ele não seja exibido no carregamento da página, o que seria carregado duas vezes

mesmo que eu remova a classe hide e defina a identificação do elemento como display:nonee adicione console.log("THE MODAL CLOSED");à função acima quando eu fechar, nada acontece.

Bootstrap 3 e 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…
});

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

Bootstrap 4

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

Veja este JSFiddle para um exemplo de trabalho:

https://jsfiddle.net/6n7bg2c9/

Consulte a seção Eventos modais dos documentos aqui:

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

Iniciando o Bootstrap 3 ( edit: ainda o mesmo no Bootstrap 4 ), existem 2 instâncias nas quais você pode disparar eventos, sendo:

1. Quando o evento "ocultar" modal é iniciado

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

2. Quando o evento "ocultar" modal terminar

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

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

Em vez de "ao vivo", você precisa usar o evento "on", mas atribuí-lo ao objeto de documento:

Usar:

$(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')
});

O Bootstrap fornece eventos que você pode conectar ao modal , como se você deseja acionar um evento quando o modal terminar de ser oculto ao usuário, você pode usar oevento hidden.bs.modal como este

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

Verifique aqui um violino de trabalho, leia mais sobre métodos e eventos modais aqui em Documentação

Bootstrap 4:

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

hide.bs.modal : este evento é acionado imediatamente quando o método da instância hide foi chamado.

hidden.bs.modal : este evento é acionado quando o modal termina de ser oculto ao usuário (aguardará a conclusão das transições CSS).

Eu faria assim:

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

O resto já foi escrito por outros. Também recomendo a leitura da documentação: jquery - on method

Eu já vi muitas respostas sobre os eventos de autoinicialização, como hide.bs.modalquais são acionados quando o modal é fechado.

Há um problema com esses eventos: quaisquer pop-ups no modal (popovers, dicas de ferramentas etc.) acionarão esse evento.

Há outra maneira de capturar o evento quando um modal é fechado.

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

O Bootstrap usa a inclasse quando o modal está aberto. É muito importante usar o hiddenevento, pois a classe inainda está definida quando o evento hideé acionado.

Esta solução não funcionará no IE8, pois o IE8 não suporta o :not()seletor Jquery .

Eu estava tendo os mesmos problemas que alguns com

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

Você precisa colocá-lo na parte inferior da página, colocando-o no topo nunca aciona o evento.

se você deseja disparar uma função em cada fechamento modal, você pode usar este método,

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

Portanto, você não precisa especificar IDs modais sempre.