MVC4 DataType.Date EditorFor won't display date value in Chrome, fine in Internet Explorer

format mvc default date 01/01/0001 to be empty
datatype(datatype.date) dd/mm/yyyy
mvc editorfor datetime datepicker
mvc textbox date format dd/mm/yyyy
how to display only date from datetime in mvc view
@html.textboxfor datepicker
date of birth data type in mvc
"@html.editorfor" datetime default value

I'm using the DataType.Date attribute on my model and an EditorFor in my view. This is working fine in Internet Explorer 8 and Internet Explorer 9, but in Google Chrome it is showing a date picker and instead of displaying the value it just displays "Month/Day/Year" in faded gray text.

Why won't Google Chrome display the value?

Model:

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

View:

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

When you decorate a model property with [DataType(DataType.Date)] the default template in ASP.NET MVC 4 generates an input field of 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" />

Browsers that support HTML5 such Google Chrome render this input field with a date picker.

In order to correctly display the date, the value must be formatted as 2012-09-28. Quote from the specification:

value: A valid full-date as defined in [RFC 3339], with the additional qualification that the year component is four or more digits representing a number greater than 0.

You could enforce this format using the DisplayFormat attribute:

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
public Nullable<System.DateTime> EstPurchaseDate { get; set; }

DataType.Date won't display date in Edit mode in Chrome but works , Date)] public DateTime EndDate { get; set; } This field uses bootstrap dat I came across this thread https://stackoverflow.com/questions/12633471/mvc4- datatype-date-editorfor-wont-display-date-value-in-chrome-fine-in-� I am trying to display a datetime field retrieved froma database in my razor file with the following: @Html.EditorFor(model => model.RequestDate); I know with 100% certainty the RequestDate

In MVC5.2, add Date.cshtml to folder ~/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)
}

[Solved] MVC4 DateTime EditorFor displaying date and also TIME , USE public TimeSpan ParkingStartTime { get; set; } in the model in case only time needed. ELSE public DateTime ParkingStartTime { get; set; } MVC4 DataType.Date EditorFor won't display date value in Chrome, fine in Internet Explorer When you decorate a model property with [DataType (DataType.Date)] the default template in ASP.NET MVC 4 generates an input field of type="date": <input class="text-box single-line" data-val="true" data-val-date="The field EstPurchaseDate must be a date."

As an addition to Darin Dimitrov's answer:

If you only want this particular line to use a certain (different from standard) format, you can use in MVC5:

@Html.EditorFor(model => model.Property, new {htmlAttributes = new {@Value = @Model.Property.ToString("yyyy-MM-dd"), @class = "customclass" } })

MVC4 DataType.Date EditorFor won't display dat, MVC4 DataType.Date EditorFor won't display dat. 人气声优 关注. 发布时间:2019- 01-01 07:58. I'm using the DataType.Date attribute on my model and an� Reply to MVC4 DataType.Date EditorFor won't display date value in Chrome, fine in IE. In the Model you need to have following type of declaration: [DataType(DataType.Date)] public DateTime? DateXYZ { get; set; } OR [DataType(DataType.Date)] public Nullable<System.DateTime> DateXYZ { get; set; } You don't need to use following attribute:

In MVC 3 I had to add:

using System.ComponentModel.DataAnnotations;

among usings when adding properties:

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

Especially if you are adding these properties in .edmx file like me. I found that by default .edmx files don't have this using so adding only propeties is not enough.

jQuery DatePicker with MVC4 and dd/MM/yyyy format � Kestrel , Add a DataAnnotation to your date field and also add the namespace reference StartDate) </div> <div class='editor-field'> @Html.EditorFor(model => model. In our case that is any field that has been adorned with the [DataType(DataType. Reply to MVC4 DataType.Date EditorFor won't display date value in Chrome, fine in IE. In the Model you need to have following type of declaration: [DataType(DataType.Date)] public DateTime? DateXYZ { get; set; } OR [DataType(DataType.Date)] public Nullable<System.DateTime> DateXYZ { get; set; } You don't need to use following attribute:

If you remove [DataType(DataType.Date)] from your model, the input field in Chrome is rendered as type="datetime" and won't show the datepicker either.

MVC EditorFor Datetime localization, MVC4 DataType.Date EditorFor won't display date Sep 28, 2012 NET MVC 4 generates an input field of type="date" : . @Html.EditorFor(model => model� EditorFor() for a List of Complex Type(MVC) MVC4 DataType.Date EditorFor won't display date value in Chrome, fine in Internet Explorer mvc3 maxLength input

How to format dates in ASP.NET Core?, NET MVC views format your properties of type datetime correctly? I have. And I've Override the underlying DataType in the model directly. 6. Insert the For Html .TextBoxFor() -calls the Data Annotations won't do the trick. MVC4 has solved this problem by adding a new TextBoxFor overload, which takes a string format parameter. You can now simply do this: @Html.TextBoxFor(m => m.EndDate, "{0:d MMM yyyy}") There's also an overload that takes html attributes, so you can set the CSS class, wire up datepickers, etc:

Examining the Edit Methods and Edit View, But first we'll take a short diversion to make the release date look better. The DataType attribute specifies the type of the data, in this case it's a date, so the time <div class="col-md-10"> @Html.EditorFor(model => model.

MVC4 DataType.Tanggal EditorFor won't menampilkan nilai tanggal , Mengapa tidak't Google Chrome menampilkan nilai? Model: [DataType( DataType.Date)] public Nullable<System.DateTime> EstPurchaseDate { get; set; }.

Comments
  • Darin thank you, that was perfect! You've answered so many of my MVC questions over the past two years, you rock!
  • Great answer but I feel this is appealing you have to force it just to get the control to work properly!
  • What would be the way of doing this "globally" for all properties marked [DataType(DataType.Date)] so I wouldn't have to mark all these properties separately with the risk of missing some?
  • Darin, What can us people outside USA do? How can I set the specification value but display a custom date format? ie, UK?
  • @MarjanVenema- I've used the "ExtensibleModelMetadataProvider" from Matt Honeycutt's FailTracker (github.com/MattHoneycutt/Fail-Tracker). Look under the Infrastructure Folder to the ModelMetadata. I've used those classes and then created an filter implementation of IModelMetadataFilter. When the TransformMetadata method is called, you can then edit the "DisplayFormatString" and "EditFormatString" properties of the metadata. Hope this gets you in the right direction (btw, there is a great pluralsight video that uses Fail-Tracker)
  • thanks! fixes the mentioned chrome "issue" and of course you can have another displayformat on your datetime property!
  • Yes great solution. This provides an excellent work around for those of us not in the US.
  • I think this is the best solution to the problem, it fixes just the editor issue and doesn't affect existing display formatting.
  • Using "Date.cshtml" instead of "DateTime.cshtml" was the magic answer! It works in MVC 4 as well.
  • Great! Obrigado.
  • As there is @ at the beginning, that @Value = @Model.Property... still need that @? Do you mean just new { Value = Model.Property...?
  • Thanks Bernie. I wasn't so trouble with the picker showing up as I was with the data not being put into the input box. This is good to know though.
  • Opera renders a datepicker though. Use modernizr to do some polyfill