2013-02-12 2 views
13

Ho codice modale:Come aggiungere un evento dopo aver chiuso la finestra modale?

<-- Button to trigger modal --> 
<div id="result"></div> 
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

<-- Modal --> 
<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
    <p>One fine body…</p> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-primary">Save changes</button> 
    </div> 
</div> 

e devo codice quando dovrebbe essere dopo la chiusura della finestra Moal:

$('#result').html('yes,result'); 

Mi dica per favore come fare che quando si chiude la finestra modale (vicino o nascondere) eseguito un secondo codice?

+0

cosa stai usando qui ??? jquery ui ?? – bipen

+0

bootstrap.js altro qui http://bootstrap-ru.com/javascript.php#modals –

+0

http://stackoverflow.com/questions/171928/hook-into-dialog-close-event –

risposta

17

Trovo risposta. Grazie a tutti, ma proprio accanto risposta:

$("#myModal").on("hidden", function() { 
    $('#result').html('yes,result'); 
}); 

eventi qui http://bootstrap-ru.com/javascript.php#modals

UPD

Per Bootstrap 3.x necessario utilizzare hidden.bs.modal:

$("#myModal").on("hidden.bs.modal", function() { 
    $('#result').html('yes,result'); 
}); 
0
$('.close').click(function() { 
    //Code to be executed when close is clicked 
    $('#result').html('yes,result'); 
}); 
+0

Questa risposta non è bootstrap-related. – Heitor

41

Se si sta utilizzando la versione 3.x di Bootstrap, il modo corretto per farlo ora è:

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

Scorri verso il basso fino alla sezione eventi per saperne di più.

http://getbootstrap.com/javascript/#modals-usage

Questo sembra rimanere immutato per ogni volta che la versione 4 uscite (http://v4-alpha.getbootstrap.com/components/modal/#events), ma se lo fa sarò sicuro di aggiornare questo post con le informazioni pertinenti.

2

Alcune risposte che possono essere utili, soprattutto se si dispone di contenuto dinamico.

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

Oppure, quando si apre il modale, avere una richiamata.

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