Question

我在初始化Date Picker之后尝试禁用某些日期。

我正在初次化这个选择器：

$( document ).ready(function() {
    $('#inputDatetime').pickadate({
        format: 'dd. mmmm yyyy',
        formatSubmit: 'yyyy-mm-dd',
        min: dt,
        selectYears: 2,
        selectMonths: true
    });
});

用户现在执行一些触发onChange()事件的操作。 disableDates()函数准备了更多日期以禁用，并使用set方法将其设置为选择器：

function disableDates() {

    var disabledDays = [];

    $.ajax({  
        url: 'partners/getInactiveDays',
        dataType: 'json',
        async: false,
        success: function(data) {

            $.each(data.days, function(i, d) {
                disabledDays.push(parseInt(d.Day.id));
            });
        }
    });

    var $input = $('#inputDatetime').pickadate();
    var picker = $input.pickadate('picker');

    picker.set({
        disable: disabledDays
    });
}

请注意，在我的情况下，disableDays根据文档（http://amsul.ca/pickadate.js/date/#disable-dates）包含整数（平日的工作日）和日期。

第一次触发disableDates()函数时，它会正确地禁用我用AJAX检索的日期。一旦第二次触发，选择器似乎不再更新。我想必须以某种方式再次渲染选择器来反映变化。我尝试了stop()和.start()以及.render()，没有任何效果。

如何正确禁用日期并刷新选择器？

Answer 1

我无法放手，所以我对它进行了相当广泛的测试。在一天结束时，它的工作方式应该如此。无需stop，start或render。问题必须与您的json数据或一般数据（日期，整数）有关。

我创建了two examples in jsfiddle，证明它确实适用于您似乎期待的数据类型。

我建议您将 data.days ， d.Day.id ，最后 disabledDays 记录到控制台，以检查它们实际包含的内容。如果没有别的，我希望你可以把我的小提琴例子作为参考。

关于代码的说明。第一次初始化选择器时，您可以将其分配给变量：

var myvar = $('#inputDatetime').pickadate({
    format: 'dd. mmmm yyyy',
    formatSubmit: 'yyyy-mm-dd',
    min: dt,
    selectYears: 2,
    selectMonths: true
});

然后，当您需要获取此实例时，您只需：

var picker = myvar.pickadate('picker');
picker.set('disable', [1,7]); //disables all saturdays & sundays

换句话说，无需重新初始化。

另外，最后一点。设置已禁用日期并不会清除以前设置的日期。您只是不断添加到已禁用日期的集合中，当您使用日期时，您只需要1-7即可在禁用所有日期之前使用。

Answer 2

在成功/错误处理程序中进行更改，并尝试在禁用之前启用所有日期：

function disableDates() {

    var disabledDays = [];
    var $input = $('#inputDatetime').pickadate();
    var picker = $input.pickadate('picker');

    $.ajax({  
        url: 'partners/getInactiveDays',
        dataType: 'json',
        async: false,
        success: function(data) {
            $.each(data.days, function(i, d) {
                disabledDays.push(parseInt(d.Day.id));
            });

            picker.set('enable', true);
            picker.set('disable', disabledDays);
        },
        error: function() {
            picker.set('disable', true);
        }
    });
}

Answer 3

¿你确定要调用你的ajax请求吗？

一些旧的，恼人的，已弃用的，功能不全的浏览器（是的，IE，我在谈论你）会在缓存中存储ajax请求，并在每个后续请求中返回第一个结果。由于您尚未将请求标记为POST，因此partners/getInactiveDays实际上只能被调用一次。

将method: 'POST'添加到您的请求中，或者将随机字符串（甚至POST请求有时存储在IE8中）附加到您的url作为不可用参数（例如url:'partnets/getInactiveDays?randomizer='+new Date().getTime()）以防止缓存存储（如果它们是没有被驱逐。

在pickadate-picker中禁用日期并刷新它

3 个答案: