Why is DisplayFormat DataFormatString not working?

Question

I have a property in my view model as follows:

[Editable(false)]
[Display(Name = "Date")]
[DisplayFormat(DataFormatString = "{0:yyyy/MM/dd}", ApplyFormatInEditMode = true)]
public DateTime MovementDate { get; set; }

Yet the markup

<td>
    @Html.DisplayFor(modelItem => item.MovementDate)
</td>

renders the date value as 2013/05/15 12:00:00 AM.

What am I doing wrong? My model:

public class WithDateModel
{
    [DisplayFormat(DataFormatString = "{0:yyyy/MM/dd}")]
    public DateTime TheDate { get; set; }
    public WithDateModel()
    {
        TheDate = DateTime.Now;
    }
}

My view:

@model ParkPay.WebTests.Models.WithDateModel
@Html.DisplayFor(m => m.TheDate)
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

What gets rendered:

2013/05/25 02:23:37 AM

Do you only want to display the date? The `DateTime` structure is an expression of a date and time. — MattSull, May 22 '13 at 22:58
@MattSull87 I am well aware that the DateTime structure includes times. That is exactly why I am trying to use teh `DataFormatString` property to exclude the time from the formatted date. — ProfK, May 23 '13 at 05:18
It wasn't working for me, because i didn't use `@Html.DisplayFor()`. I commented this here in case other people will do the same mistake. — Jo Smo, Jul 29 '15 at 16:57
Use [DataType(DataType.Date] to only return the DATE part of DATETIME. — Panoone, Mar 07 '18 at 01:27

score 48 · Answer 1 · edited Sep 09 '20 at 17:05

48

If you can't get it working on the model, you could try it on the view.

@Html.TextBoxFor(m => m.ValidFrom, "{0:dd/MM/yyyy}", new {maxlength = 10})

edited Sep 09 '20 at 17:05

MarredCheese

17,541
8
92
91

answered Jan 15 '14 at 10:37

user1616625

1,072
1
9
15

35

This solution worked for me. Also, as a side-note, DisplayFormat is ignored in "TextBoxFor". – Frederik Feb 24 '14 at 07:33
19

DisplayFormat is ignored in "TextBoxFor" - Gotta love microsoft's consistency here :( – Adam Tolley Sep 11 '15 at 16:51
2

@AdamTolley agree, completely anti-intuitive – Filip Dec 02 '15 at 23:50
6

Wouldn't this essentially be considered 'hard-coding it' though? I'm using `EditorFor()` and it's not working either; and I'd REALLY rather not have to 'hard-code' it. – Scott Fraley Dec 09 '16 at 19:31
2

Apparently, the attribute works well for `@Html.EditorFor` and not the other helpers. You can use the EditorFor helper and you can always add your custom class using `@Html.EditorFor(x=> x.MyProperty, new { htmlAttributes = new { @class = "MyCssClass" } })` – GidiBloke Nov 04 '19 at 09:30

score 14 · Accepted Answer · answered May 23 '13 at 09:04

Why are you using ApplyFormatInEditMode if you have set [Editable(false)]? All ApplyFormatInEditMode does is format the date if you have it in a text box or something for editing, which you probably won't because of the aforementioned.

I was able to get the date to display correctly using the following:

[DisplayFormat(DataFormatString = "{0:yyyy/MM/dd}")]
public DateTime Date 
{
    get
    {
        return DateTime.Now;
    }
    set
    {
        Date = DateTime.Now;
    }
}

and in the view (with resulting output):

@Html.DisplayFor(x => x.Date)        // 2013/05/23
<br />
@Model.Date                          // 23/05/2013 09:57:56
<br />
@Html.DisplayFor(x => Model.Date)    // 2013/05/23

Hope this helps.

It is much easier to have a superfluous `ApplyFormatInEditMode ` on each `DisplayFormat` attribute than to have to add or remove it if I add or remove the `[Editable(false)]` attribute. — ProfK, May 23 '13 at 19:57

score 6 · Answer 3 · answered Apr 18 '15 at 09:05

Since You want to exclude the time to get Only Date: At Model:-

 [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy/MM/dd}"]
   public DateTime TheDate { get; set; }

At Views:-

    @Html.DisplayFor(model=> model.TheDate)
    @Html.JQueryUI().DatepickerFor(model => model.TheDate)

The tutorial of the following link may help you.It works for me.

http://ilyasmamunbd.blogspot.com/2014/02/jquery-ui-datepicker-popup-calendar.html

Setting `ApplyFormatInEditMode` did it for me. – Kai Hartmann Jul 14 '16 at 06:22 — Kai Hartmann, Jul 14 '16 at 06:22

score 3 · Answer 4 · answered Dec 20 '17 at 18:33

3

You have to annotate the type as Date

[DataType(DataType.Date)]

answered Dec 20 '17 at 18:33

Prakash G. R.

4,746
1
24
35

1

This annotation creates an HTML5 date input rather than a textbox, which may or may not be the desired result. – brichins Mar 23 '18 at 21:26

score 2 · Answer 5 · answered Sep 29 '17 at 22:19

In my case a teammate had defined a global display template (aka ~\Views\Shared\DisplayTemplates\DateTime.cshtml) that I didn't realize took precedence over my [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}")] on my model property.

The solution was to move my format string to new shared template, so the attribute changes to:

// see ~\Views\Shared\DisplayTemplates\DateMyFormat.cshtml for formatting
[UIHint("DateMyFormat")]
public DateTime MovementDate { get; set; }

score 0 · Answer 6 · answered Dec 02 '16 at 15:25

This work for me:

In the model:

using System.ComponentModel.DataAnnotations;

namespace Athlete.Models
{
    public class Foo
    {

        [DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}")]
        public DateTime SignDate
        {
           get;
           set;
        }
    }
}

And in the view:

<td style="text-align:left;">@Html.DisplayFor(modelItem => item.SignDate)</td>

score 0 · Answer 7 · answered Mar 05 '20 at 13:37

I had a similar issue with a datepicker which was showing the date in the wrong order. Fixed it by using the HTML 5 value field. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

<input asp-for="From" type="text" class="pickadate picker__input" value="@Model?.From.ToString("MM/dd/yyyy")">

score -3 · Answer 8 · answered Jan 23 '17 at 21:58

You need the var name in the Display Name:
[Display(Name = "MovementDate")]
public DateTime MovementDate { get; set; }

[Editable(false)]
[Display(Name = "MovementDate")]
[DisplayFormat(DataFormatString = "{0:yyyy/MM/dd}", ApplyFormatInEditMode = true)]
public DateTime MovementDate { get; set; }

Why is DisplayFormat DataFormatString not working?

8 Answers8

Linked