使用flatpickr在onChange事件之前获取所选日期

时间:2019-07-09 08:06:06

标签: javascript date datepicker onchange flatpickr

我目前有一个开始日期和结束日期日期选择器,该选择器预先填充了页面加载时的日期。如果用户单击下一个按钮而没有与日期选择器交互,则我将无法在选择器中获得正确的日期,而只能将日期作为字符串。

但是我可以从onChange事件中检索日期,但是在某些情况下可能要晚一些。

以下是我的代码示例,以进行更多说明:

startDateAccomm = flatpickr("#StartDate", {
  minDate: instance.selectedDates[0],
  dateFormat: dateFormat,
  onChange: function (selectedDates, dateStr, instance) {
    if (selectedDates.length > 0) {
        endDateAccomm.config.minDate = selectedDates[0];

    if (startDateAccomm.selectedDates.length > 0) {
        startDateSelected = startDateAccomm.selectedDates[0].getFullYear() + "-" + (startDateAccomm.selectedDates[0].getMonth() + 1) + "-" + startDateAccomm.selectedDates[0].getDate();
    }

    if (endDateAccomm.selectedDates.length > 0) {
        endDateSelected = endDateAccomm.selectedDates[0].getFullYear() + "-" + (endDateAccomm.selectedDates[0].getMonth() + 1) + "-" + endDateAccomm.selectedDates[0].getDate();
    }
  }

  if () {
    //do something here.
  }
}

我想将最小日期设置为页面加载时预先填充的日期,但由于在与日期选择器进行交互之前未定义实例,因此无法采用正确的格式。

非常感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

尝试了flatpickr https://flatpickr.js.org/events/#hooks提供的各种事件和挂钩之后,我就可以使用onReady事件。

onReady: function (selectedDates, dateStr, instance) {

        startDateSelected = selectedDates[0].getFullYear() + "-" + 
        (selectedDates[0].getMonth() + 1) + "-" + selectedDates[0].getDate();            

    },