我有一个用于日期选择器的自定义 knockoutJs 绑定(bind)。
ko.bindingHandlers.valueAsDatePicker = {...}
当绑定(bind)的输入字段状态(启用/禁用)绑定(bind)到 KO 可观察对象时,它不会启用/禁用日期选择器图标。
HTML
<input id="txtRequestedTo" type="text" placeholder="dd/mm/yyyy"
data-bind="valueAsDatePicker: reqDateTo, disable: reqDateFrom().length < 1" />
自定义绑定(bind)
ko.bindingHandlers.valueAsDatePicker = {
init: function(element, valueAccessor, allBindingsAccessor) {
ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor);
formatAndSetDateValue(element, valueAccessor, allBindingsAccessor);
// Init UI datepicker
var dateFormat = allBindingsAccessor.dateFormat
$(element).datepicker({
dateFormat: dateFormat,
changeMonth: true,
changeYear: true,
yearRange: '1900:' + new Date().getFullYear(),
maxDate: 0,
showOn: "button",
buttonImage: "Content/images/sprite-base/sprite/icon-calender.png",
buttonImageOnly: true,
constrainInput: false,
buttonText: ""
});
},
update: function(element, valueAccessor, allBindingsAccessor) {
// Use the value binding
ko.bindingHandlers.value.update(element, valueAccessor, allBindingsAccessor);
formatAndSetDateValue(element, valueAccessor, allBindingsAccessor);
valueAccessor().valueHasMutated();
}
};
如果元素被禁用,我希望日期选择器被禁用,反之亦然。
最佳答案
非常感谢罗伯特,
这是有效的解决方案。
Using KnockOutJS V3.1
init: function (element, valueAccessor, allBindings) {
...
//Disable the datepicker if the item is disabled or enabled.
if (allBindings.has('disable')) {
if (allBindings.get('disable')()) {
$(element).datepicker('disable');
}
else {
$(element).datepicker('enable');
}
var subscription = allBindings.get('disable').subscribe(function (newValue) {
if (newValue) {
$(element).datepicker('disable');
} else {
$(element).datepicker('enable');
}
});
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
subscription.dispose();
});
}
}
你必须使用
if (allBindings.has('disable')) {
否则
allBindings.get('disable')
将是未定义的,因为并非 View 中的所有日期选择器绑定(bind)字段都具有 disabled 属性。
关于javascript - Knockout DatePicker 绑定(bind)项不会禁用 DatePicker,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22003090/