使用淘汰赛无法触发beforeShowDay

Question

我是knockoutJS的新手，我试图使用自定义绑定绑定一个datepicker。下面是我的viewmodel JS文件。

/*Date picker value binder for knockout*/
ko.bindingHandlers.datepicker = {
init: function (element, valueAccessor, allBindingsAccessor) {

    var options = {
        showOtherMonths: true,
        selectOtherMonths: true,
       beforeShowDay: function (date) {

            alert('looking for an alert');
            return [false, '', 'available'];
        },
        showOn: "both"
    };

    $(element).datepicker(options);

    $(element).datepicker(options).on("changeDate", function (ev) {
        var observable = valueAccessor();
        observable(ev.date);

    });
},
update: function (element, valueAccessor) {
    var value = ko.utils.unwrapObservable(valueAccessor());
    $(element).datepicker("setValue", value);
}
};



/*View model*/
 function ViewModel() {
   var self = this;
   self.dateFromClient = ko.observable('12/12/2010')
                        .extend({ required: true });
 }


$(document).ready(function () {

//model binding with validation
var vm = new ViewModel();

ko.applyBindings(vm);

});

以下是我的观点。

 <div>

        <input type="text" readonly="readonly" data-date-format="dd-mm-yyyy" class="datepicker" data-bind="datepicker: dateFromClient" />

  </div>

我正在寻找的是禁用在日历上点击的几个日期。这就是我开始返回false的原因（希望禁用选择器上的每个日期。）但我没有看到任何日期被禁用。

有人可以指导我这样做的正确途径吗？

Answer 1

尝试这样的事情

查看：

<input type="text" readonly="readonly" data-bind="datepicker:$data.dateFromClient" />

<强>视图模型：

ko.bindingHandlers.datepicker = {
    init: function (element, valueAccessor, allBindingsAccessor) {
        var options = {
            showOtherMonths: true,
            selectOtherMonths: true,
            beforeShowDay: function (date) {
                alert('looking for an alert');
                return [false, '', 'available'];
            },
            showOn: "both"
        };

        $(element).datepicker(options);

        $(element).datepicker(options).on("changeDate", function (ev) {
            var observable = valueAccessor();
            observable(ev.date);

        });
    },
    update: function (element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        current = $(element).datepicker("getDate");
        if (value - current !== 0) {
            $(element).datepicker("setDate", value);   
        }
    }
};


/*View model*/
var ViewModel = function () {
    var self = this;
    self.dateFromClient = ko.observable();
}

ko.applyBindings(new ViewModel());

工作小提琴 here