我有一个我用knockout创建的页面,似乎找不到引导日期选择器的任何事件处理程序,我已经查看了一些流行的工具,如eyecon,但是似乎找不到一个合适的事件处理程序,它将Date值绑定到我的ViewModel。然而,我找到了一个适用于jQueryUi的方法:
ko.bindingHandlers.datepicker = {
init: function (element, valueAccessor, allBindingsAccessor) {
//initialize datepicker with some optional options
var options = allBindingsAccessor().datepickerOptions || {};
$(element).datepicker(options);
//handle the field changing
ko.utils.registerEventHandler(element, "change", function () {
var observable = valueAccessor();
observable($(element).datepicker("getDate"));
});
//handle disposal (if KO removes by the template binding)
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
$(element).datepicker("destroy");
});
},
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor()),
current = $(element).datepicker("getDate");
if (value - current !== 0) {
$(element).datepicker("setDate", value);
}
}
};
但是没有用于bootstrap。我创建了我用我的Viewmodel创建的我的WebForm Fiddle。任何建议都将不胜感激。
答案 0 :(得分:1)
这是一个使用bootstrap-datepicker.js的工作(最小)版本。它应该给你一个起点:
ko.bindingHandlers.datepicker = {
init: function (element, valueAccessor, allBindingsAccessor) {
//initialize datepicker with some optional options
var options = allBindingsAccessor().datepickerOptions || {};
$(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);
}
};