2
votes

I have a Telerik Kendo Grid with several bound columns. All columns are working as expected except this DateTime-column tsCreated, which is always null.

The Model:

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

The Grid:

@(Html.Kendo().Grid<NNC.ViewModels.OrderViewModel>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(c => c.tsCreated);
            columns.Bound(c => c.orderNr);
            columns.Bound(c => c.customerName);
            columns.Bound(c => c.description);                
        })
        .Groupable()
        .Filterable()
        .Sortable()
        .Pageable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .Events(events => events.Error("kendoGrid_ErrorHandler"))
            .Model(model => model.Id("orderNr"))
            .Read(read => read.Action("EditingInline_Read", "Orders"))                
        )
)

The JSON data does show the date in tsCreated:

{
 "Data":[{"orderNr":"13011155","tsCreated":"\/Date(1423579599377)\/",
 "description":"xxxx","customerName":"xxxxx"}],"Total":1,
 "AggregateResults":null,"Errors":null
 }

I also created a ClientTemplate to display the value, like this:

columns.Bound(c => c.tsCreated).ClientTemplate(
                "W= #= tsCreated #"
            );

But it displays:

W= null

Any help is appreciated!

2
Are you using Globalize.js? Because Kendo UI conflicts with Globalize.js. To fix this just load Kendo before Globalize.absurdrefusal
Thank you @NicolásCarlo, I added this as the answer. If you would like to do that yourself, please to and I will accept that as the answer. Many thanks, costs me way to many hours, but that's the way you learn ;-)roberth
Added that as the answer. I'm glad it helped. :)absurdrefusal

2 Answers

1
votes

The problem happens if you're using Globalize.js. Kendo UI conflicts with Globalize's date functions so currently the workaround is to load Globalize.js after Kendo UI related scripts.

Here's the relevant discussion on Telerik's forum (found at: http://www.telerik.com/forums/registering-globalize-js-before-kendo-culture-js-causes-datetime-columns-in-grids-to-fail-formatting):

Basically when you load the globalize library, kendo.parseDate starts using Globalize.parseDate method instead of our own implementation of kendo.parseNumber. And since the globalize parser is not able to parse the format that the MVC returns the date successfully.

e.g.

Globalize.parseDate("/Date(-47876400000)/")

Loading the globalize library after the Kendo scripts wont override our implementation and the Grid will parse it successfully.

I am afraid there is no other work-around to this case.

0
votes

Perhaps the date conversion from UNIX epoch is failing? Can try using the Kendo UI date conversion.

@(Html.Kendo().Grid<NNC.ViewModels.OrderViewModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.tsCreated).ClientTemplate("W= #= kendo.toString(tsCreated , "m") #");
        columns.Bound(c => c.orderNr);
        columns.Bound(c => c.customerName);
        columns.Bound(c => c.description);                
    })
    .Groupable()
    .Filterable()
    .Sortable()
    .Pageable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Events(events => events.Error("kendoGrid_ErrorHandler"))
        .Model(model => model.Id("orderNr"))
        .Read(read => read.Action("EditingInline_Read", "Orders"))                
        )
)