这是我想出的编辑器和显示模板,允许用户输入并在他们自己的时区显示时间,并将其转换为 UTC 以供提交。
它需要将 UIHint 属性设置为每个模型 UTC DateTime 字段的自定义值“UTCTime”,如下所示,以选择正确的显示和编辑器模板。没有此注释的模型中的 DateTimes 将不会受到影响:
[UIHint("UTCTime")]
[DataType(DataType.DateTime)]
public DateTime LastSeen { get; set; }
/Views/Shared/EditorTemplatesUTCTime.cshtml:
@model DateTime?
@{
var name = Html.GetFieldNameForModel(); // See the HTML extension at the end of this post
var boxName = name + ".Value";
var boxId = name + "_Value";
var divId = name + "_UTC";
}
@Html.TextBoxFor(m => m.Value, new { type = "datetime", onBlur ="$('#" + name + "').val(UTCDateFuncs.ToUTCDate($('#" + boxId + "').val()));$('#" + divId + "').html('UTC:' + $('#" + name + "').val());$('#" + boxId + "').attr('title','UTC:' + $('#" + name + "').val());" })<span id="@divId"></span>
<script>
new function () {
var utcVal = $('#@(boxId)').val();
$('#@(boxId)').val(UTCDateFuncs.FromUTCDate(utcVal));
$('#@(boxId)').attr('title', 'converted from UTC ' + utcVal);
}
</script>
@Html.HiddenFor(m=>m)
\Views\Shared\DisplayTemplates\UTCTime.cshtml
@model DateTime?
@if(Model.HasValue){<span class="UTCTime">@Model</span>}
网站模板中或某处(但不在模板中)所需的 javascript:
// UTC Date
$(function () {
$('.UTCTime').each(function () {
var oldtext = $(this).html();
var result = UTCDateFuncs.FromUTCDate(oldtext);
$(this).html(result);
$(this).attr("title", "Converted from UTC " + oldtext);
});
});
var UTCDateFuncs = {
ToUTCDate: function (datetext) {
try {
var n = new Date(datetext);
offsetms = n.getTimezoneOffset() * 60 * 1000;
n = new Date(n.valueOf() + offsetms);
result = n.toDateString() + " " + n.toLocaleTimeString();
}
catch (ex) {
console.warn("Error converting time", ex);
}
return result;
},
FromUTCDate: function (datetext) {
var result;
try {
var n = new Date(datetext);
offsetms = n.getTimezoneOffset() * 60 * 1000;
n = new Date(n.valueOf() - offsetms);
result = n.toDateString() + " " + n.toLocaleTimeString();
}
catch (ex) {
console.warn("Error converting time", ex);
}
return result;
}
};
还利用了这个 HTML 扩展:
\Controllers\Extensions\HtmlExtensions.cs
using System;
using System.Web.Mvc;
public static class HtmlExtensions
{
public static string GetFieldNameForModel<TModel>(this HtmlHelper<TModel> htmlHelper)
{
var ti = htmlHelper.ViewData.TemplateInfo;
var name = ti.HtmlFieldPrefix;
return name;
}
}
这仅用于我们的管理页面,因此在显示编辑框转换结果的文本框之后有一个不太用户友好的跨度。