Kendo grid date column not formatting

问题:

I have a KendoGrid like below and when I run the application, I'm not getting the expected format for date column.

$("#empGrid").kendoGrid({     dataSource: {         data: empModel.Value,         pageSize: 10     },      columns: [         {             field: "Name",             width: 90,             title: "Name"         },          {             field: "DOJ",             width: 90,             title: "DOJ",             type: "date",             format:"{0:MM-dd-yyyy}"          }     ] });

When I run this, I'm getting "2013-07-02T00:00:00Z" in DOJ column. Why it is not formatting? Any idea?

回答1:

I found this piece of information and got it to work correctly. The data given to me was in string format so I needed to parse the string using kendo.parseDate before formatting it with kendo.toString.

columns: [     {         field: "FirstName",         title: "FIRST NAME"     },     {         field: "LastName",         title: "LAST NAME"     },     {         field: "DateOfBirth",         title: "DATE OF BIRTH",         template: "#= kendo.toString(kendo.parseDate(DateOfBirth, 'yyyy-MM-dd'), 'MM/dd/yyyy') #"     }, ...

---

References:

1. format-date-in-grid
2. jsfiddle
3. kendo ui date formatting

回答2:

just need putting the datatype of the column in the datasource

dataSource: {       data: empModel.Value,       pageSize: 10,       schema:  {                 model: {                     fields: {                         DOJ: { type: "date" }                             }                        }                }              }

and then your statement column:

 columns: [     {         field: "Name",         width: 90,         title: "Name"     },      {         field: "DOJ",         width: 90,         title: "DOJ",         type: "date",         format:"{0:MM-dd-yyyy}"      } ]

回答3:

Try formatting the date in the kendo grid as:

columns.Bound(x => x.LastUpdateDate).ClientTemplate("#= kendo.toString(LastUpdateDate, \"MM/dd/yyyy hh:mm tt\") #");

回答4:

This is how you do it using ASP.NET:

add .Format("{0:dd/MM/yyyy HH:mm:ss}");       @(Html.Kendo().Grid()             .Name("grid")             .Columns(columns =>             {                  columns.Bound(c => c.AttributeName);                 columns.Bound(c => c.UpdatedDate).Format("{0:dd/MM/yyyy HH:mm:ss}");                })             .HtmlAttributes(new { @class = ".big-grid" })             .Resizable(x => x.Columns(true))             .Sortable()             .Filterable()                 .DataSource(dataSource => dataSource                 .Ajax()                 .Batch(true)                 .ServerOperation(false)                         .Model(model =>                         {                             model.Id(c => c.Id);