wake-up-neo.net

Bootstrap 3-Datentimepicker-Ereignisse werden nicht gestartet

Ich benutze Bootstrap 3 DateTimePicker und versuche Beispiel 8 (Linked datetimepicker).

Javascript

$('#dpStart').datetimepicker({
     pickDate: true,                 //en/disables the date picker
     pickTime: false,
     format: "DD-MM-YYYY",
     useMinutes: false,               //en/disables the minutes picker
     useSeconds: false
});

$('#dpEnd').datetimepicker({
     pickDate: true,                 //en/disables the date picker
     pickTime: false,
     format: "DD-MM-YYYY",
     useMinutes: false,               //en/disables the minutes picker
     useSeconds: false
});

$("#dpStart").on("dp.change", function(e) {
     alert('hey');
     $('#dpEnd').data("DateTimePicker").setMinDate(e.date);
});

$("#dpEnd").on("dp.change", function(e) {
     $('#dpStart').data("DateTimePicker").setMaxDate(e.date);
});

HTML

<div class="row">
  <div class="col-md-6 col-sm-6 form-group">
    <label for="txtStartDate">
      Start Date-Time</label>
    <div class="input-group date" id="dpStart" data-date-format="DD-MM-YYYY">
      <asp:TextBox ID="txtStartDate" runat="server" CssClass="form-control"></asp:TextBox>
      <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
      </span>
    </div>
  </div>
  <div class="col-md-6 col-sm-6 form-group">
    <label for="txtEndDate">
      End Date-Time</label>
    <div class="input-group date" id="dpEnd" data-date-format="DD-MM-YYYY">
      <asp:TextBox ID="txtEndDate" runat="server" CssClass="form-control"></asp:TextBox>
      <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
      </span>
    </div>
  </div>
</div>

Der Kalender wird gemäß den Anforderungen angezeigt, aber die Ereignisse wie dp.change, dp.hide, dp.show werden nicht gestartet. Was könnte das Problem sein? Irgendeine Hilfe?

EDIT: Bitte beachten Sie, dass ich alle erforderlichen Dateien wie Bootstrap js, bootstrap css, Moment.js und datetimepicker js und css enthalten habe.

41
writeToBhuwan

Das mag dumm erscheinen, aber haben Sie überprüft, dass Sie dasselbe bootstrap-datetimepicker.js-Plugin verwenden, auf das Sie sich in Ihrer Frage beziehen?

Ich kenne zwei Versionen, die sich sehr ähneln:

  1. Die Version, die Sie in Ihrer Frage angegeben haben: http://eonasdan.github.io/bootstrap-datetimepicker/
  2. Eine etwas andere Version: http://www.eyecon.ro/bootstrap-datepicker/

Die erste Version reagiert auf change.dp, während die zweite Version auf dp.change antwortet.

Überprüfen Sie einfach die Kommentare oben in bootstrap-datetimepicker.js, um zu sehen, welchen Sie verwenden.

53
itsmejodie

Prüfen Sie, ob Sie moment.js laden, bevor Sie datetimepicker.js laden.

6
da Rocha Pires

Tempus Dominus (selbst als Nachfolger des sehr beliebten Eonasdan/bootstrap-datetimepicker definiert) scheint das Ereignis in change.datetimepicker geändert zu haben. 

0
glerendegui

Ich verwende bootstrap datetime picker. Nach umfangreichen Recherchen funktioniert der folgende Code für mich:

$('.data_date_of_birth').on('changeDate', function(event) {
  alert($(this).val());
});
0
Kamlesh