Daterangepicker：选择日期时如何阻止开始日期和结束日期相同？

Question

我在我的网站上使用 JQuery 的 daterangepicker 插件，使用户能够选择预订房间的入住和退房日期。我已确保用户无法选择任何已经过去的日期，但我的问题是，当用户选择特定日期作为其入住日期时，他们将能够再次选择相同的日期作为其退房日期，这就是我想避免他们这样做。例如，如果他们选择 2022 年 3 月 14 日作为入住日期，则可以再次选择 2022 年 3 月 14 日作为退房日期。

这是我为实现这项工作所做的努力：

$(".checkin").daterangepicker({
    autoApply: true,
    alwaysShowCalendars: true,
    formatDate: 'MM/DD/YYYY', // Format i chose for setting how date should look
    startDate: moment(), // I set the starting date to be the current date
    endDate: moment().add(1, 'days'), // I set the no of days not to exceed 1 day but it made only the current day selectable
    minDate: moment(),
    maxDate: moment().add(1, "days"),
    clickDate(): function(e) { // I saw this method in the daterangepicker object but it didn't work
        console.log("Specified date clicked");
    }
});

谁可以帮助我解决这个问题？

Answer 1

如果您不希望用户选择确切的开始和结束日期，那么您可以在daterangerpicker函数中尝试：

avoid

clickDate(): function(e) 

相反，使用下面的代码覆盖相同的日期并通过添加一天使它们连续

$('input').daterangepicker({
opens: 'left'
}, 
function(start_date,end_date) {

/*Comparing the start date and end date. if user

selected the same date then we will add one day in end date */

       if(start_date.format('DD/MM/YYYY') === end_date.format('DD/MM/YYYY')){

/* Using moment js for adding one day and overriding it into the end date

you can  call another function below to use dates */

            end_date= (moment( end_date.format('DD/MM/YYYY'), "DD/MM/YYYY").add(1, 'days'));

            $('input').data('daterangepicker').setEndDate(end_date.format('DD/MM/YYYY'));
        }
});