jquery-ui-dialog - Come collegarsi all'evento di chiusura della finestra di dialogo

Question

Sto usando il jquery-ui-dialog plugin

Sto cercando un modo per aggiornare la pagina quando in alcune circostanze quando la finestra di dialogo è chiusa.

C'è un modo per catturare un evento vicino dalla finestra di dialogo?

So di poter eseguire il codice quando si fa clic sul pulsante Chiudi, ma ciò non copre la chiusura dell'utente con escape o la x nell'angolo in alto a destra.

Answer 1

L'ho trovato!

Puoi prendere l'evento close usando il seguente codice:

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

Ovviamente posso sostituire l'avviso con tutto ciò che devo fare.
Modifica: A partire da Jquery 1.7, il bind () è diventato on ()

Answer 2

Credo che tu possa farlo anche durante la creazione della finestra di dialogo (copiata da un progetto che ho realizzato):

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 chiudi: CloseFunction

Answer 3

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

Answer 4

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

" vicino " la proprietà della finestra di dialogo fornisce l'evento close per lo stesso.

Answer 5

Puoi provare anche tu

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

Answer 6

Questo è ciò che ha funzionato per me ...

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

Answer 7

  

A partire da jQuery 1.7, il metodo .on () è il metodo preferito per associare i gestori di eventi a un documento.

Poiché nessuno ha effettivamente creato una risposta utilizzando. on () invece di bind () ho deciso di crearne una.

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

Answer 8

aggiungi l'opzione 'chiudi' come sotto esempio e fai quello che vuoi funzione in linea

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

Answer 9

Se sto capendo il tipo di finestra di cui stai parlando, $ (window) .unload () (per la finestra di dialogo) ti darebbe l'amo di cui hai bisogno?

(E se ho frainteso e stai parlando di una finestra di dialogo creata tramite CSS piuttosto che di una finestra del browser pop-up, allora tutti i modi per chiudere quella finestra sono elementi per cui potresti registrare i gestori dei clic .)

Modifica: Ah, ora vedo che stai parlando di dialoghi jquery-ui, che sono fatti tramite CSS. Puoi agganciare la X che chiude la finestra registrando un gestore di clic per l'elemento con la classe ui-dialog-titlebar-close .

Più utile, forse, ti sta dicendo come capirlo rapidamente. Durante la visualizzazione della finestra di dialogo, basta aprire FireBug e Ispeziona gli elementi che possono chiudere la finestra. Vedrai immediatamente come sono definiti e ciò ti dà ciò di cui hai bisogno per registrare i gestori dei clic.

Quindi, per rispondere direttamente alla tua domanda, credo che la risposta sia davvero " no " - non c'è un evento vicino che puoi agganciare, ma " sì " - puoi agganciare tutti i modi per chiudere abbastanza facilmente la finestra di dialogo e ottenere ciò che desideri.

Answer 10

Puoi provare il seguente codice per catturare l'evento di chiusura per qualsiasi elemento: pagina, finestra di dialogo ecc.

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