Pickadate.js 动态更改禁用天数

Question

我在结帐页面上使用 Pickadate.js 库，供客户在 select collection 日期订购产品。

在back-end中，客户可以屏蔽某些日子，这样客户就不能select这一天。例如。周日，因为商店在周日休息。

我正在像这样初始化库：

/* Initiate the Datepicker */
        var $dateInput = $('#collection-date').pickadate({
            firstDay: 2,
            onSet: function(e) {
                if(e.select) {
                    $('#select-time').slideDown();
                    var timeInput = $('#collection-time').pickatime();
                } else {
                    $('#select-time').slideUp();
                }
            },
        });
        var picker = $dateInput.pickadate('picker');

在结帐页面上，客户可以在 collection 次不同的 2 家商店之间进行选择，因此日历需要能够选择哪家商店正在 selected 并基于此，显示 collection 的可用天数。

我是这样设置禁用天数的：

function get_disabled_days(store_id) {

        var days_array = [];
        days_array = $('#store-' + store_id).find('.disabled-days').attr('data-disabled-dates').split(',').map(function(item) {
            return parseInt(item, 10);
        });

        //console.log(days_array);

        return days_array;

    }

存储 select 后，我调用：

picker.set('disable', get_disabled_days(store_id));

此函数正确 returns 天数数组（作为整数）并阻止正确的天数。

一旦客户更换商店，我的问题就来了。它不是重置禁用天数数组，而是简单地添加 selected 商店的禁用天数。因此，如果客户 select 是第二家商店，日历将屏蔽第一家 selected 商店和第二家 selected 商店的日期。

我已经尝试停止（）库并重新初始化它，但这不起作用，但我无法弄清楚如何清除禁用的日期数组和 re-set 一旦客户 select这是一家新店。

Answer 1

如果我理解正确，您需要重置日期选择器中的日期，以便在选择新商店时仅禁用与该商店相关的日期。

如 the docs 指定，

An important thing to note here is that “setting” something as enabled or disabled adds the new elements to the collection of items to disable rather than completely replacing them with the new collection.

那么您能否只启用运行禁用调用之前的所有日期？

// Enable all the dates
picker.set('enable', true)
picker.set('disable', false)

picker.set('disable', get_disabled_days(store_id));

Pickadate.js 动态更改禁用天数

Pickadate.js dynamically changes disabled days

javascript

jquery

pickadate