jQuery UI Datepicker使用新的DefaultDate销毁并重新初始化日历 [英] jQuery UI Datepicker destroy and reinitialize calendar with new DefaultDate

问题描述

我正在建立一个预订系统，并希望我们的结帐日期选择器日历显示适当的日期.例如，我在2018年6月5日签入，签出日历应在2018年6月开始.为此，我们将defaultDate设置为签入日期来初始化签出日历.很简单，并且第一次使用就可以了.但是，如果我们返回并更改签入日期，则签出日历会将旧的签入日期保留为默认值.我以为我已经解决了这个问题，方法是销毁了结帐日历，并使用新的defaultDate重新初始化了一个新日历，实际上，它可以更改除defaultDate之外的任何其他属性.

I'm building a booking system, and want our checkout date picker calendar to show appropriate dates. For example, I check in June 5th 2018, the checkout calendar should start in June 2018. To accomplish this we initialize the checkout calendar with defaultDate set to the check in date. Simple, and it works the first time. If, however, we go back and change the check in date, the checkout calendar keeps the old check in date for its default. I thought I had fixed this problem by destroying the checkout calendar and re-initializing a new one with a new defaultDate, and can, in fact, change any other attribute except defaultDate.

以下是一些代码:

首次结帐初始化

First Checkout Initialization

$("#checkout").datepicker({
      numberOfMonths: 2,
      changeMonth: false,
      changeYear: false,
      defaultDate: checkin,
      beforeShow: function() {...},
      beforeShowDay: function(date) {...}
    })

*选择新的入住日期之后

$( "#checkout" ).datepicker( "destroy" );

如果我尝试简化控制台中的内容，我将手动销毁签出日历，检查以确保单击签出字段时不会弹出该签出日历，然后仅使用defaultDate参数重新初始化一个新的签出日历.这显示了一个默认的带有旧日期的单月日历.

If I try to simplify things in the console, I manually destroy the checkout calendar, check to make sure it doesn't pop up when clicking the checkout field, then reinitialize a new checkout calendar using ONLY the defaultDate parameter. This shows me a default single month calendar with the old date.

这到底是怎么回事?

推荐答案

我最终利用

$("#checkout").datepicker({
  numberOfMonths: 2,
  changeMonth: false,
  changeYear: false,
  beforeShow: function() {...},
  beforeShowDay: function(date) {...}
})
$("#checkin").datepicker("setDate", checkin);

而不是使用defaultDate或minDate，即使在页面上所有其他日期选择器都被销毁后，它们仍保留其值.我在其他地方发布了此问题，如果收到任何其他反馈，将更新此答案，但是目前，具有相同问题的任何人都可以通过使用setDate内置函数而不是设置defaultDate或minDate选项.

Instead of using defaultDate or minDate, which were retaining their values even after all the other datepickers on the page had been destroyed. I posted this problem elsewhere and will update this answer if I get any additional feedback, but for the time being, anyone with the same issue can likely find some relief by using the setDate built-in function instead of setting defaultDate or minDate options.

这篇关于jQuery UI Datepicker使用新的DefaultDate销毁并重新初始化日历的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！