Wie fügen Sie Datum und Uhrzeit auswählen bootstrap-plugin?

Vom http://www.w3schools.com/bootstrap/bootstrap_modal.asp:

<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

Wie kann ich ein Datum und eine Uhrzeit auswählen, die auf dieses popup blockieren?

InformationsquelleAutor Rahul Prajapati | 2015-12-19

  1. 2
    <div class="input-append date form_datetime">

    <input size="16" type="text" value="" readonly>
    <span class="add-on"><i class="icon-th"></i></span>


</div>


<script type="text/javascript">

    $(".form_datetime").datetimepicker({

        format: "dd MM yyyy - hh:ii"
    });

</script>

    Hier ist die demo http://www.malot.fr/bootstrap-datetimepicker/demo.php

    1. Oben genannten link werfen download demo zip
    2. Entpacken Sie die zip-Datei
    3. überprüfen demo im Extrahierten zip -
    4. verwenden Sie in Ihrem web -
    5. entfernen Sie unnötige jQuery /CSS /Javascript, die Konflikte mit Ihrem web-CSS /Javascript /jQuery

    InformationsquelleAutor Rahul Prajapati

  2. 1

    In den Körper des modal fügen Sie den html-Code für das Eingabefeld und Kalender-Symbol wie dieses:

    <div class="input-group date" data-provide="datepicker">
  <input type="text" class="form-control">
  <div class="input-group-addon">
    <span class="glyphicon glyphicon-th"></span>
  </div>
</div>

    In Ihrem main.js Datei -, master-Seite, oder auch auf Seiten-Ebene, stellen Sie die javascript-Aufruf wie dieser:

    $('.datepicker').datepicker({
  format: 'mm/dd/yyyy',
  startDate: '-3d'
})

    natürlich gibt es auch andere Optionen zur Steuerung Ihrer Funktionen und anzeigen, darunter reicht. Lesen Sie die Dokumentation, um mehr Optionen bootstrap-datepicker

    Werden und sicher sein, Sie haben JQuery.js, Bootstrap.js und bootstrap-datepicker.js in dieser Reihenfolge referenziert werden, die in Ihrer Seite, den Kopf oder den Boden vor dem schließen der

    Hier ist ein demo.

    Ich brauche Datum und Uhrzeit picker nicht nur Datum.

    InformationsquelleAutor LOTUSMS

Schreibe einen Kommentar