daterangepicker禁用日期

Question

我有这个脚本供用户可以保留日期，但我想禁用保留日期，但他不起作用，你能帮助我吗？

让天=[]； // 初始化天数数组

$(document).ready(function() { // 获取服务器端传入的保留日期 constservedDates = @json($reservedDates).map(date => formatDate(new Date(date)));

复制 // 将保留的日期数组记录到控制台 console.log("保留日期：",servedDates);

$('#dateRnage').dateRangePicker({ 单月：正确， 显示快捷方式：假， 显示顶部栏：假， startDate: new Date(), // 开始日期是今天 isInvalidDate：函数（日期）{ // 将日期格式设置为“YYYY-MM-DD” const formattedDate = formatDate(日期);

      // Log the date being checked to the console
      console.log("Checking Date:", formattedDate);

      // Disable the date if it matches any reserved date
      const isDisabled = reservedDates.includes(formattedDate);
      console.log(`Date ${formattedDate} is ${isDisabled ? 'disabled' : 'enabled'}`);
      return isDisabled;
  },

});

我想禁用相同的日期，但他不工作

Answer 1

您似乎想根据保留的日期禁用日期范围选择器中的特定日期。您的方法在概念上是正确的，但可能存在一些问题导致它无法按预期工作。

let days = []; // Initialize days array

$(document).ready(function() {
    // Function to format dates as 'YYYY-MM-DD'
    function formatDate(date) {
        let day = date.getDate().toString().padStart(2, '0');
        let month = (date.getMonth() + 1).toString().padStart(2, '0');
        let year = date.getFullYear();
        return `${year}-${month}-${day}`;
    }

    // Retrieve the reserved dates passed from the server-side
    const reservedDates = @json($reservedDates).map(date => formatDate(new Date(date)));

    // Log the reserved dates array to the console
    console.log("Reserved Dates:", reservedDates);

    $('#dateRnage').dateRangePicker({
        singleMonth: true,
        showShortcuts: false,
        showTopbar: false,
        startDate: new Date(), // Start date is today
        isInvalidDate: function(date) {
            // Format the date to 'YYYY-MM-DD'
            const formattedDate = formatDate(date);

            // Log the date being checked to the console
            console.log("Checking Date:", formattedDate);

            // Disable the date if it matches any reserved date
            const isDisabled = reservedDates.includes(formattedDate);
            console.log(`Date ${formattedDate} is ${isDisabled ? 'disabled' : 'enabled'}`);

            return isDisabled;
        }
    });
});