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

标签 javascript jquery calendar flatpickr

我正在使用 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>

最佳答案

通过添加 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>

关于javascript - flatpickr:将第二个日期选择器的日期设置为第一个日期选择器的同一日期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56365449/

相关文章:

java - 如何初始化 TIME 数组? java 语

ios - 使用swift为日历中的日期着色

vba - 如何在 Outlook 中将约会添加到共享日历?

javascript - 如何从 Chrome 扩展程序获得运行 google 应用程序脚本的权限?

javascript - jQuery fadeIn() 和 fadeOut() 的正确使用方法是什么?

javascript - Parsley 远程验证码验证

javascript - 滚动按钮与 native 浏览器滚动条一致

javascript - Chrome 扩展 : Block page items before access

javascript - extjs 5,在gridpanel上deine dropzone,但不能drop,为什么?

javascript - JS无法调用函数