淘汰赛未填充日期时间?当初始为空时
本文关键字:当初 填充 日期 时间 淘汰赛 | 更新日期: 2023-09-27 17:55:09
我正在使用挖空将我的视图模型绑定到我的视图。我的视图模型中的多个属性可为空,例如 DateTime?
s。下面是一个示例:
public class ViewModel
{
public int ID { get; set; }
public string Name { get; set; }
public DateTime? CreationDate { get; set;}
}
如您所见,属性 CreationDate
是一个可为空的DateTime
。
我正在使用自定义日期选择器绑定器绑定属性:
ko.bindingHandlers.datepicker = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
try {
var jsonDate = ko.utils.unwrapObservable(valueAccessor());
var value = parseJsonDateString(jsonDate);
var strDate = value.getMonth() + 1 + "/"
+ value.getDate() + "/"
+ value.getFullYear();
element.setAttribute('value', strDate);
}
catch (exc) {
}
$(element).change(function () {
var value = valueAccessor();
value(element.getAttribute('value'));
});
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
var val = valueAccessor();
val(element.getAttribute('value'));
}
};
var jsonDateRE = /^'/Date'((-?'d+)('+|-)?('d+)?')'/$/;
var parseJsonDateString = function (value) {
var arr = value && jsonDateRE.exec(value);
if (arr) {
return new Date(parseInt(arr[1]));
}
return value;
};
这使我能够在视图中绑定我的属性,如下所示:
<input type="text" data-bind="datepicker: CreationDate" />
问题
问题来了。有时此属性在进入视图时已为 null。JSON 示例可能如下所示:
{
"Id": 2004,
"Name": "Test",
"CreationDate": null
}
如果是这种情况,并且我将此值更改为日期选择器中的某个随机值,并将ajax POST发送到我的控制器,我可以看到模型仍然等于CreationDate
null
。
因此,如果模型进入视图时DateTime
为 null,如何填充 models 属性?
自己找到了解决方案
我设法通过简单地将我的绑定更改为以下内容来解决我的问题:
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();
var value = $(element).val();
// if the input field is empty, the value is falsy and therefore the observable should be = null
if(!value){
observable(null);
} else {
var date = new Date(value);
observable(date);
}
});
//handle disposal (if KO removes by the template binding)
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
$(element).datepicker("destroy");
});
},
//update the control when the view model changes
update: function (element, valueAccessor) {
var value = ko.unwrap(valueAccessor());
//if the value received is null, we should display nothing in the input field
if (value === null) {
$(element).val(null);
} else {
//we need to manipulate the data to show something user friendly to the user
var date = parseJsonDateString(value);
var strDate = date.getMonth() + 1 + "/"
+ date.getDate() + "/"
+ date.getFullYear();
$(element).val(strDate);
}
}
};
所以基本上如果我在update
函数中获得的值,只需设置$(element).val(null)
.这样,可以正确处理可为 null 的属性。