203

我在我的模型上使用 DataType.Date 属性,在我的视图中使用 EditorFor。这在Internet Explorer 8Internet Explorer 9中运行良好,但在Google Chrome中,它显示了一个日期选择器,而不是显示值,它只是以褪色的灰色文本显示“月/日/年”。

为什么谷歌浏览器不显示该值?

模型:

[DataType(DataType.Date)]
public Nullable<System.DateTime> EstPurchaseDate { get; set; }

看法:

<td class="fieldLabel">Est. Pur. Date</td>
<td class="field">@Html.EditorFor(m=>m.EstPurchaseDate)</td>

铬合金

IE浏览器

4

8 回答 8

389

当您在 ASP.NET MVC 4 中使用默认模板装饰模型属性时,[DataType(DataType.Date)]会生成一个输入字段type="date"

<input class="text-box single-line" 
       data-val="true" 
       data-val-date="The field EstPurchaseDate must be a date."
       id="EstPurchaseDate" 
       name="EstPurchaseDate" 
       type="date" value="9/28/2012" />

支持 HTML5 的浏览器(例如 Google Chrome)使用日期选择器呈现此输入字段。

为了正确显示日期,该值的格式必须为2012-09-28. 引用规范

value: [RFC 3339] 中定义的有效完整日期,附加条件是年份部分是四位或更多位,表示大于 0 的数字。

DisplayFormat您可以使用以下属性强制执行此格式:

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
public Nullable<System.DateTime> EstPurchaseDate { get; set; }
于 2012-09-28T06:06:51.770 回答
45

在 MVC5.2 中,将 Date.cshtml 添加到文件夹 ~/Views/Shared/EditorTemplates:

@model DateTime?
@{
    IDictionary<string, object> htmlAttributes;
    object objAttributes;
    if (ViewData.TryGetValue("htmlAttributes", out objAttributes))
    {
        htmlAttributes = objAttributes as IDictionary<string, object> ?? HtmlHelper.AnonymousObjectToHtmlAttributes(objAttributes);
    }
    else
    {
        htmlAttributes = new RouteValueDictionary();
    }
    htmlAttributes.Add("type", "date");
    String format = (Request.UserAgent != null && Request.UserAgent.Contains("Chrome")) ? "{0:yyyy-MM-dd}" : "{0:d}";
    @Html.TextBox("", Model, format, htmlAttributes)
}
于 2014-11-13T22:00:15.587 回答
18

作为 Darin Dimitrov 回答的补充:

如果您只希望此特定行使用某种(不同于标准)格式,则可以在 MVC5 中使用:

@Html.EditorFor(model => model.Property, new {htmlAttributes = new {@Value = @Model.Property.ToString("yyyy-MM-dd"), @class = "customclass" } })
于 2014-12-19T12:47:51.047 回答
11

在 MVC 3 中,我必须添加:

using System.ComponentModel.DataAnnotations;

添加属性时的用途:

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]

特别是如果您像我一样在 .edmx 文件中添加这些属性。我发现默认情况下 .edmx 文件没有使用此功能,因此仅添加属性是不够的。

于 2013-01-03T11:46:22.837 回答
10

如果您[DataType(DataType.Date)]从模型中删除,Chrome 中的输入字段将呈现为type="datetime"并且也不会显示日期选择器。

于 2012-10-04T10:55:32.097 回答
4

我仍然在传递格式 yyyy-MM-dd 时遇到问题,但我通过更改 Date.cshtml 解决了这个问题:

@model DateTime?

@{
    string date = string.Empty;
    if (Model != null)
    {
        date = string.Format("{0}-{1}-{2}", Model.Value.Year, Model.Value.Month, Model.Value.Day);
    }

    @Html.TextBox(string.Empty, date, new { @class = "datefield", type = "date"  })
}
于 2012-11-29T13:09:30.160 回答
3

回复MVC4 DataType.Date EditorFor 不会在 Chrome 中显示日期值,在 IE 中没问题

在模型中,您需要具有以下类型的声明:

[DataType(DataType.Date)]
public DateTime? DateXYZ { get; set; }

或者

[DataType(DataType.Date)]
public Nullable<System.DateTime> DateXYZ { get; set; }

您不需要使用以下属性:

[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]

在 Date.cshtml 使用这个模板:

@model Nullable<DateTime>
@using System.Globalization;

@{
    DateTime dt = DateTime.Now;
    if (Model != null)
    {
        dt = (System.DateTime)Model;

    }

    if (Request.Browser.Type.ToUpper().Contains("IE") || Request.Browser.Type.Contains("InternetExplorer"))
    {
        @Html.TextBox("", String.Format("{0:d}", dt.ToShortDateString()), new { @class = "datefield", type = "date" })
    }
    else
    {
        //Tested in chrome
        DateTimeFormatInfo dtfi = CultureInfo.CreateSpecificCulture("en-US").DateTimeFormat;
        dtfi.DateSeparator = "-";
        dtfi.ShortDatePattern = @"yyyy/MM/dd"; 
        @Html.TextBox("", String.Format("{0:d}", dt.ToString("d", dtfi)), new { @class = "datefield", type = "date" })
    } 
}

玩得开心!问候,布莱顿

于 2013-12-31T13:32:04.953 回答
2

如果您需要控制日期的格式(换句话说,不仅仅是 yyyy-mm-dd 格式是可以接受的),另一种解决方案可能是添加一个字符串类型的辅助属性并向该属性添加一个日期验证器,并绑定到 UI 上的此属性。

    [Display(Name = "Due date")]
    [Required]
    [AllowHtml]
    [DateValidation]
    public string DueDateString { get; set; }

    public DateTime? DueDate 
    {
        get
        {
            return string.IsNullOrEmpty(DueDateString) ? (DateTime?)null : DateTime.Parse(DueDateString);
        }
        set
        {
            DueDateString = value == null ? null : value.Value.ToString("d");
        }
    }

这是一个日期验证器:

[AttributeUsage(AttributeTargets.Property, AllowMultiple = true, Inherited = true)]
public class DateValidationAttribute : ValidationAttribute
{
    public DateValidationAttribute()
    {
    }

    protected override ValidationResult IsValid(object value, ValidationContext validationContext)
    {
        if (value != null)
        {
            DateTime date;

            if (value is string)
            {
                if (!DateTime.TryParse((string)value, out date))
                {
                    return new ValidationResult(validationContext.DisplayName + " must be a valid date.");
                }
            }
            else
                date = (DateTime)value;

            if (date < new DateTime(1900, 1, 1) || date > new DateTime(3000, 12, 31))
            {
                return new ValidationResult(validationContext.DisplayName + " must be a valid date.");
            }
        }
        return null;
    }
}
于 2015-01-12T13:59:55.717 回答