Bootstrap - Wie um zu zeigen, modale box mit der option aus wählen?

Wie kann ich die modal-box auf Bootstrap mit <option> aus <select> ich habe versucht, die Standard-Weg, aber es funktioniert nicht.

$('#myModal').on('shown.bs.modal', function () {
  $('#myInput').focus()
});

<select class="form-control">
    <option>select</option>
    <option data-toggle="modal" data-target="#myModal">Second Option</option>
</select>

Siehe meine Beispiel für eine bessere Aufklärung.

  • aber es funktioniert im fiddle
  • Wie kommt das? Wenn ich die Option "Zweite Möglichkeit" der modal-box nicht erscheinen wird.
  • dann müssen Sie aktualisieren Sie die fiddle, das es funktioniert, auf die "Zweite Option" modal geöffnet wird
  • NÖ, ist es nicht hier arbeiten. Können Sie aktualisieren und den link hier einfügen für uns bitte?
  • das ist Ihre Geige jsfiddle.net/brunodd/umnv2p1t es zu arbeiten und dies machte ich einige änderungen im code jsfiddle.net/umnv2p1t/2 beide Geigen arbeiten modal angezeigt wird
  • Das ist komisch. Meine Geige immer noch nicht funktioniert hier. Nachdem Sie Ihre änderungen vorgenommen, es funktioniert jetzt. =) Vielen Dank! Sie können Ihren Veränderungen als eine Antwort auf die Frage, wenn Sie wollen.
  • wenn dies ist genau die Lösung, die Sie suchen, wird es Antwort mit Erklärung ?

InformationsquelleAutor brunodd | 2015-10-01
  1. 6

    Immer noch nicht sicher, warum OP zu beharren, fiddle in Frage, nicht zu arbeiten, wo ich sehen kann das es funktioniert kann sein das ich zu viel Kaffee heute 🙂

    Schnelle Lösung zuordnen-id <select> im HTML - <select class="form-control" id="myselect"> 

    <select class="form-control" id="myselect">
    <option value="">select</option>
    <option value="secondoption">Second Option</option>
</select>

    Hinzufügen value im select Optionen und unter Ausnutzung der jQuery Funktion Ändern bekommen value der Zweiten Option und verwenden Sie Vergleichsoperatoren
    vergleichen Wert und wenn Sie Wert true öffnen können, der modal mit Bootstrap-JS Modal via JavaScript.

    $(document).ready(function(){ //Make script DOM ready
    $('#myselect').change(function() { //jQuery Change Function
        var opval = $(this).val(); //Get value from select element
        if(opval=="secondoption"){ //Compare it and if true
            $('#myModal').modal("show"); //Open Modal
        }
    });
});

    Fiddle

    • Eigentlich hatte ich nicht genug Kaffee heute! Aber vielen Dank, dass ist genau das was ich suchte. =)
    InformationsquelleAutor Shehary
Schreibe einen Kommentar