Bootstrap Modal Dynamic Inhalt

Question

Ich benötige eine Methode um dynamische Inhalte zu laden, die sich jederzeit ändern können. Gemäß der Dokumentation Bootstrap

<a data-toggle="modal" href="remote.htm" data-target="#modal">Click me</a>

macht Gebrauch von den jQuerys .load den Inhalt einmal nur geladen werden. Es injiziert den Inhalt in das Modal-Content-Div. Wie bereits erwähnt, kann der Inhalt dieses Modals jederzeit geändert werden und daher brauche ich eine andere Methode. Irgendwelche Ideen?

TL; DR - Ich bin auf der Suche nach einer Methode, die dynamischen Inhalt (Remote) jedes Mal, wenn das Modal öffnet statt einmal (Standard Bootstrap modal) lädt.

Answer 1

Wenn Ihre Benutzer die Verzögerung tolerieren können, laden Sie den Inhalt jedes Mal neu, wenn das Show-Ereignis eintritt.

$('#modal').on('show.bs.modal', function(){ 
    $.get("remote.htm", function(data){ 
     $('#modal').find('.modal-content').html(data); 
    }) 
}) 

Add Fehlerbehandlung und Parameter benötigt als

Answer 2

dieser Kerl hat eine schmutzig, aber funktionierende Lösung: http://www.whiletrue.it/how-to-update-the-content-of-a-modal-in-twitter-bootstrap/

<a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a> 

wird:

<a href="javascript:$('#modal .modal-body').load('remote.html',function(e){$('#modal').modal('show');});">Click me</a> 

Answer 3

Sie können richtig die modalen ist klar, Cache unter Verwendung von:

$('#your-modal').removeData('bs.modal'); 

Siehe https://github.com/twbs/bootstrap/pull/7935#issuecomment-21166069
Sie würden wahrscheinlich, dass in einem Event-Handler für die modalen die hidden.bs.modal Ereignis machen wollen.

Obwohl sind Sie wahrscheinlich besser dran mit clientseitigen Templating und ein wenig benutzerdefinierten JavaScript, die notwendigen Daten zu laden, statt data-remote in erster Linie verwendet wird. Besonders seit Bootstrap has deprecated the remote modal option.