Format JSON Date in Grid

[James]

Here is an example of a JSON date passed to the client:

    "date":         {
        "date": 14,
        "day": 2,
        "hours": 0,
        "minutes": 0,
        "month": 7,
        "seconds": 0,
        "time": 1344920400000,
        "timezoneOffset": 300,
        "year": 112
    }

How can I display this date in a Kendo grid as MM/dd/yyyy? I have tried:

$("#resultsGrid").kendoGrid( {

  dataSource: {

            type: "json"
    },

     columns: [

            {

                field: "date",

                title: "Date",

                format: "{0:MM/dd/yyyy}"

}]});

However, the grid displays [object Object].

[OnaBai]

I'm afraid that your dates are not actually of type "Date". You should do some extra work.
Either you change the server to send it as expected or you should implement a "parse" function (this is one of the ways of converting data) in your datasource schema for converting it into Date.

$("#grid").kendoGrid({

    dataSource:{

        type:"json",

        data:dates,

        schema:{

            parse:function (data) {

                var res = [];

                $.each(data, function (idx, elem) {

                    res.push({ date:new Date(elem.date.time) });

                });

                return res;

            }

        }

    },

    columns:[

        {

            field:"date",

            title:"Date",

            format:"{0:MM/dd/yyyy}"

        }

    ]

});

Here I iterate on each element of the returned array and get the elem.date.time  and convert it into Date.

[James]

Thanks. You're right; the "date" object is the JSON representation of a Java Date object.

A search form exists on the page. When the user clicks submit, an AJAX call to the server is made. The response data is used to populate the grid. The function that you assigned to parse worked well in my handle AJAX response function. This code is executed on the response data prior to calling grid.dataSource.data(response) and grid.refresh(). Thanks again for your help.

[Basem]

Or you can specify the field type directly in the grid column itself:

columns: [

  {

    field: 'StartDate',

    title: 'Starts',

    type: 'date',

    template: '#= kendo.toString(StartDate, "yyyy/MM/dd") #'

  }

]

Ends up being this on the frontend: 2012/11/18