javascript - flatpickr:将第二个日期选择器的日期设置为第一个日期选择器的同一日期

Question

我正在使用 flatpikr https://flatpickr.js.org/我希望在出站(仅日期)选择器的关闭事件中，将返回选择器的初始日期设置为第一个选择器中选择的相同日期。我编写的这段代码可以工作，但没有切换到正确的月份页面，它只是禁用出站选择器中所选日期之前的所有日期。您可以在此处查看预订表格中发生的情况。

https://anekitalia.com/en/

我尝试在 on close 函数中使用 defaultDate 而不是 minDate，但它不起作用。

<script>
 $( function() {
 /*selecting datepiker language*/
 flatpickr.localize(flatpickr.l10ns.en);
 /*declaring return datepicker*/
 var FLATPICKER_RITORNO = flatpickr('#cal_DATA_RITORNO', {
 altInput: true,
 altFormat: "j F, Y",
 dateFormat: "d-m-Y", 
 disableMobile: "true",
 maxDate: new Date().fp_incr(365),
 });
 /*declaring outbound datepicker*/
 $("#cal_DATA_ANDATA").flatpickr(
 {
 altInput: true,
 altFormat: "j F, Y",
 dateFormat: "d-m-Y",
 disableMobile: "true",
 minDate: "today",
 maxDate: new Date().fp_incr(365),
 defaultDate: "today",
 /* setting initial date of return picker to the one selected in 
 outbound*/
 onClose: function( selectedDates, dateStr, instance ) {
 FLATPICKER_RITORNO.set( 'minDate', dateStr)}
 });
 } );
</script>

Answer 1

通过添加 setDate(dateObj) 并将 onClose 事件更改为 onChange 修复了此问题，因此代码现在如下所示

<script>
  $(function () {
    /*selecting datepiker language*/
    flatpickr.localize(flatpickr.l10ns.en);
    /*declaring return datepicker*/
    var FLATPICKER_RITORNO = flatpickr('#cal_DATA_RITORNO', {
      altInput: true,
      altFormat: "j F, Y",
      dateFormat: "d-m-Y",
      disableMobile: "true",
      maxDate: new Date().fp_incr(365),
      defaultDate: "today"
    });
    /*declaring outbound datepicker*/
    $("#cal_DATA_ANDATA").flatpickr(
      {
        altInput: true,
        altFormat: "j F, Y",
        dateFormat: "d-m-Y",
        disableMobile: "true",
        minDate: "today",
        maxDate: new Date().fp_incr(365),
        defaultDate: "today",
        /* setting initial date of return picker to the one selected in 
        outbound*/
        onChange: function (dateStr, dateObj) {
          FLATPICKER_RITORNO.set("minDate", dateObj);
          FLATPICKER_RITORNO.setDate(dateObj);
        }
      });
  });
</script>