Ankündigung

Einklappen
Keine Ankündigung bisher.

bootstrap 4 modal add/change buttons mit jquery

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • bootstrap 4 modal add/change buttons mit jquery

    Hallo,

    unten habe ich wie es Standard ist den modal auf der Seite.

    HTML-Code:
    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="modal-title"> &ndash; </h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div id="modal-body" class="modal-body">
      </div>
      <div id="modal-footer" class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
    </div>
    </div>
    Aufruf geht über:
    Code:
    $('#modal-title').text("Error");
    $('#myModal').modal('show');
    Wie ist das es bei bootstrap 4 wenn man einen Button in den footer hinzufügen möchte?
    Mit jquery, damit man zum Beispiel:
    einen 'cancel' und 'submit' button hat oder 'cancel' und 'save' je nach dem was man braucht??

    Mit:
    Code:
    $('#modal-footer').append('<button type="button" class="btn btn-secondary">submit</button>');
    ändere ich den main und andere modal calls ändern sich auch.
    Es soll aber nur diesen Modal Aufruf sein.

    Hätte es gern wie bootstrap3-dialog: https://nakupanda.github.io/bootstrap3-dialog/

    Ist das mit Bootstrap 4 möglich???

    MfG c01001.
    Ob eine Sache gelingt, erfährst du nicht, wenn du darüber nachdenkst, sondern wenn du es ausprobierst.


  • #2
    Musst halt das Modal wieder in den Ursprungzustand zurücksetzen sobald es geschlossen wird. Das Modal feuert einen Event wenns zugeht.

    Ganz unten:
    https://getbootstrap.com/docs/4.3/components/modal/

    Kommentar


    • #3
      Dann benutze einen vernünftigen Selector:
      Code:
      #myModal .modal-footer
      Die ID´s "modal-footer, modal-body" etc. machen keinen Sinn.



      Kommentar


      • #4
        Zitat von jonas3344 Beitrag anzeigen
        Musst halt das Modal wieder in den Ursprungzustand zurücksetzen sobald es geschlossen wird. Das Modal feuert einen Event wenns zugeht.

        Ganz unten:
        https://getbootstrap.com/docs/4.3/components/modal/
        Also wenn du
        Code:
        .modal('dispose');
        meinst, funktioniert leider nicht!!!


        Zitat von kaminbausatz Beitrag anzeigen
        Dann benutze einen vernünftigen Selector:
        Code:
        #myModal .modal-footer
        Die ID´s "modal-footer, modal-body" etc. machen keinen Sinn.
        Danke für die Info, werde ich ändern.

        Habe eine andere Lösung gefunden.
        http://bootboxjs.com


        Ob eine Sache gelingt, erfährst du nicht, wenn du darüber nachdenkst, sondern wenn du es ausprobierst.

        Kommentar


        • #5
          Ne

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

          Kommentar

          Lädt...
          X