Wie erkennt man die Ablehnung eines modalen Bootstrap-Dialogs in Javascript?

Question

Ich versuche, mit dem modalen Bootstrap-Dialog zu arbeiten. Die Ereignisse, die ich verwende, sind hidden und show. Ich habe kein Problem mit dem show Ereignis. Ich verstehe nicht, wie man das hidden Ereignis auf der anderen Seite verwendet. Ich zeige ein Formular im modalen Dialog an und auf dem submit Ereignis des Formulars verbirg ich den modalen Dialog mit $('.modal').modal('hide'). Dieses Ausblenden-Ereignis wird auch ausgelöst, wenn das Modal durch Verwendung des Schließen-Symbols, durch Klicken auf eine Abbruchschaltfläche mit diesem Markup <button type="button" class="btn btn-default" data-dismiss="modal">Abort</button>, durch Drücken der Escape-Taste oder durch Klicken auf eine beliebige Stelle auf .modal-backdrop ausgelöst wird. Wie kann ich eine erfolgreiche Formularübergabe von einer Ablehnung des Dialogs unterscheiden?

Answer 1

ich dieses Problem in einer etwas hacky Weise gelöst haben: Wenn das Formular abgeschickt wird, i den Wert eines benutzerdefinierten Daten Attribut eines Elements ändern, die nicht Teil der ist Formular wird eingereicht. Wenn das Ereignis hidden ausgelöst wird, vergleiche ich die Werte meines benutzerdefinierten Datenattributs mit dem aktuellen Wert des Eingabeelements in der Form, die im Modal angezeigt wurde. Wenn sich die beiden Werte unterscheiden, wurde das Modal abgelehnt, andernfalls wurde es eingereicht.

$('#modalWithForm').on('submit', 'form', function (e) { 
    e.preventDefault(); 
    $.ajax({ 
     url: $(this).attr('action'), 
     method: 'POST', 
     data: { 
      param: parseInt($('#input').val(), 10), 
     } 
    }).done(function () { 
     $('label[data-custom]').data('custom', $('#input').val()); 
     $('#modalWithForm').modal('hide'); 
    }); 
}); 

$('#modalWithForm').on('hidden.bs.modal', function() { 
    var modalDismissed = parseInt($('#input').val(), 10) !== parseInt($('label[data-custom]').data('custom')); 
    $.ajax({ 
     url: '/Update', 
     method: 'POST', 
     dataType: "text", 
     data: { 
      param: parseInt(modalDismissed ? $('label[data-custom]').data('custom') : $('#input').val(), 10) 
     } 
    }).done(function (updatedForm) { 
     $('form').empty().html(updatedForm); 
    }); 
}); 

Answer 2

Seit Bootstrap 3:

$('#yourModal').on('hidden.bs.modal', function() { 
    // code here 
});