jquery-ui-dialog - Como conectar-se ao evento de fechamento da caixa de diálogo

Estou usando o jquery-ui-dialogplugin

Estou procurando uma maneira de atualizar a página quando, em algumas circunstâncias, quando a caixa de diálogo estiver fechada.

Existe uma maneira de capturar um evento próximo a partir da caixa de diálogo?

Eu sei que posso executar o código quando o botão Fechar é clicado, mas isso não cobre o fechamento do usuário com escape ou o x no canto superior direito.

Eu encontrei!

Você pode capturar o evento close usando o seguinte código:

 $('div#popup_content').on('dialogclose', function(event) {
     alert('closed');
 });

Obviamente, posso substituir o alerta pelo que for necessário.
Edit: A partir do Jquery 1.7, o bind () tornou-se em ()

Eu acredito que você também pode fazer isso enquanto cria a caixa de diálogo (copiada de um projeto que eu fiz):

dialog = $('#dialog').dialog({
    modal: true,
    autoOpen: false,
    width: 700,
    height: 500,
    minWidth: 700,
    minHeight: 500,
    position: ["center", 200],
    close: CloseFunction,
    overlay: {
        opacity: 0.5,
        background: "black"
    }
});

Nota close: CloseFunction

$("#dialog").dialog({
    autoOpen: false,
    resizable: false,
    width: 400,
    height: 140,
    modal: true, 
    buttons: {
        "SUBMIT": function() { 
        $("form").submit();
    }, 
        "CANCEL": function() { 
        $(this).dialog("close");
    } 
    },
    close: function() {
      alert('close');
    }
});

$( "#dialogueForm" ).dialog({
              autoOpen: false,
              height: "auto",
              width: "auto",
              modal: true,
                my: "center",
                at: "center",
                of: window,
              close : function(){
                  // functionality goes here
              }  
              });

A propriedade "close" da caixa de diálogo fornece o evento close para o mesmo.

Você também pode tentar isso

$("#dialog").dialog({
            autoOpen: false,
            resizable: true,
            height: 400,
            width: 150,
            position: 'center',
            title: 'Term Sheet',
            beforeClose: function(event, ui) { 
               console.log('Event Fire');
            },
            modal: true,
            buttons: {
                "Submit": function () {
                    $(this).dialog("close");
                },
                "Cancel": function () {
                    $(this).dialog("close");
                }
            }
        });

Isto é o que funcionou para mim...

$('#dialog').live("dialogclose", function(){
   //code to run on dialog close
});

A partir do jQuery 1.7, o método .on () é o método preferido para anexar manipuladores de eventos a um documento.

Porque ninguém criou uma resposta com o uso. on()em vez de bind()eu decidi criar um.

$('div#dialog').on('dialogclose', function(event) {
     //custom logic fired after dialog is closed.  
});

adicione a opção 'close' como na amostra e faça o que você deseja função inline

close: function(e){
    //do something
}

Se eu estou entendendo o tipo de janela que você está falando, não $ (window) .unload () (para a janela de diálogo) não daria o que você precisa?

(E se eu entendi errado, e você está falando sobre uma caixa de diálogo feita via CSS, em vez de uma janela pop-up do navegador, então tudo as maneiras de fechar essa janela são elementos pelos quais você pode registrar manipuladores de cliques.)

Edit: Ah, agora vejo que você está falando sobre diálogos jquery-ui, que são feitos via CSS. Você pode conectar o X que fecha a janela registrando um manipulador de cliques para o elemento na classe ui-dialog-titlebar-close .

Mais útil, talvez, é lhe dizer como descobrir isso rapidamente. Enquanto estiver exibindo a caixa de diálogo, basta abrir o FireBug e Inspecionar os elementos que podem fechar a janela. Você verá instantaneamente como eles são definidos e isso fornece o que você precisa para registrar os manipuladores de cliques.

Portanto, para responder diretamente à sua pergunta, acredito que a resposta é realmente "não" - não há um evento próximo que você possa conectar, mas "sim" - você pode conectar todas as maneiras de fechar a caixa de diálogo com bastante facilidade e obter o que você quer.

Você pode tentar o seguinte código para capturar o evento de fechamento de qualquer item: página, caixa de diálogo etc.

$("#dialog").live('pagehide', function(event, ui) {
      $(this).hide();
});