flatpickr实例不会打开

时间:2016-08-23 01:40:43

标签: javascript jquery calendar flatpickr

我有一些使用flatpickr日历实例的HTML。我想要做的是在单击附带的跨度时仅打开特定的日历实例。

<div class="formRow">
    <div class="datetimepicker input-group date">
        <input id="initial-notification-date-time" name="initial-notification-date-time" type="text" class="form-control" />
        <span class="input-group-addon"></span>
    </div>
</div>

随附的Javascript是:

$('.datetimepicker input').flatpickr({
  dateFormat: 'm/d/Y',
  enableTime: true,
  defaultDate: new Date(),
  onReady: function() {
      var flatPickrInstance = this;
      console.log(flatPickrInstance);
      console.log($(".datetimepicker input").siblings(".datetimepicker span")); 
      $(".datetimepicker input").siblings(".datetimepicker span").click(function () {
          $(".datetimepicker input").flatpickr();
      });
  }
});

目前的做法是导致&#34; .datetimepicker输入的所有实例&#34;重新初始化为新实例。我如何实际导致我要打开的实例?

1 个答案:

答案 0 :(得分:0)

您每次都要重新初始化flatpickr。你需要做这样的事情:

$('.datetimepicker input').flatpickr({
  dateFormat: 'm/d/Y',
  enableTime: true,
  defaultDate: new Date(),
  onReady: function() {
      var flatPickrInstance = this;
      var $flatPickrInput = $(flatPickrInstance.element);
      $flatPickrInput.siblings("span").click(function () {
          flatPickrInstance.toggle();
      });
  }
});