Bootstrap Modal Onload-Ereignis

Question

Hat ein Bootstrap-Modal ein Onload-Ereignis? Ich möchte eine HTTP-GET-Anforderung aufrufen, wenn das Modal geöffnet wird, um das Modal mit Daten aus einer Rest-API zu füllen. Ich habe eine Form im Modal und ich habe die GET-Funktion für das Onload-Ereignis des Formulars aufgerufen, aber es funktioniert nicht.

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title" id="myModalLabel">Agent details:</h4> 
     </div> 
     <div class="modal-body"> 

<form onload="getData()" style= "font-size: 16pt"> 

Answer 1

Pro der documentation können Sie die Show oder die gezeigten Ereignisse hören.

Aus der Dokumentation:

show.bs.modal => Dieses Ereignis wird ausgelöst, sofort, wenn die Show Instanz-Methode aufgerufen wird.

shown.bs.modal => Dieses Ereignis wird ausgelöst, wenn das Modal für den Benutzer sichtbar gemacht wurde (wartet auf CSS-Übergänge, um abzuschließen).

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

Answer 2

Was ich gefunden habe, ist der beste Weg, dies zu tun, ist das Onclick-Attribut in das HTML-Element hinzuzufügen, die die modale aufruft.

<button type="button" onclick="PopulateAddModal()" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#AddModal">Add</button> 

Dann in Ihrem Javascript ..

function PopulateAddModal() { 
 
     //do stuff here... 
 
     }

Dadurch wird sichergestellt, dass der Code, sobald die modal aufgerufen wird, läuft. Andernfalls wird der JavaScript-Code erst ausgeführt, wenn das Modal die "Fade-In" -Animation vollständig abgeschlossen hat.