Format a DateTime in a MVC Template

Question

Using the example from Kendo's ComboBox: (ASP.NET MVC | template.cshtml)

@(Html.Kendo().ComboBox()
      .Name("customers")
      .DataTextField("ContactName")
      .DataValueField("CustomerID")
      .HtmlAttributes(new { style = "width: 400px" })
      .DataSource(source =>
      {
          source.Read(read =>
          {
              read.Action("GetCustomers", "Home");
          });
      })
      .Filter("startswith")
      .Height(300)
      .Template("<img src=\"" + Url.Content("~/Content/web/Customers/") + "${data.CustomerID}.jpg\" alt=\"${data.CustomerID}\" />" +
                        "<dl>" +
                            "<dt>Contact:</dt><dd>${ data.ContactName }</dd>" +
                            "<dt>Company:</dt><dd>${ data.CompanyName }</dd>" +
                        "</dl>")
)

Inside the Template if you want to use a value that is a DateTime, for example ${ data.StartDate } you would end up with something like this: 2012-06-13T00:00:00

What would the syntax be to format that to a readable Date inside that Template?

http://docs.kendoui.com/getting-started/framework/globalization/dateformatting — Nick, May 24 '13 at 18:03

score 0 · Answer 1 · answered May 24 '13 at 18:09

The quick and dirty solution would be to create a new property that outputs your date as a string.

The more correct solution would be to feed the output of the property to a javascript date formatting function. You could use something like date.js.

Add this code:

"<dt>StartDate:</dt><dd>" + Date.parse('${ data.StartDate}').toString("M/d/yyyy") + "</dd>" +

score 0 · Answer 2 · edited May 23 '17 at 11:58

0

The best solution to your date formatting would be to create a DisplayTemplate at Views/Shared/DisplayTemplates/DateTime.cshtml

    @model DateTime

    @String.Format("{0:dd/MM/yyyy}", Model))

that would change it universally

source

edited May 23 '17 at 11:58

Community

1
1

answered May 24 '13 at 18:14

Rachel Gallen

27,943
21
72
81

Format a DateTime in a MVC Template

2 Answers2