Can we return complex objects in Kendo Grid' read?

Question

I have a Kendo Grid, currently we create the data source as:

var gridDataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: '@Url.Action("GetData", "Report")',
                dataType: "json"
            }
        },
        group: [
          { field: "Name" },
        ],
        pageSize: 20,
        serverPaging: false,
        serverFiltering: false,
        sort: { field: "Date", dir: "desc" },
        schema: {
            ......
            model: {
                fields: {
                    Date: { type: "date" },
                    Name: { type: "string" },
                    Version: { type: "string" },
                    Count: { type: "number" }
                }
            }
        }
    });

It calls GetData in Report to get the data. The returned data is a list of Class ReportRow which has Date, Name, Version, Count.

In the backend, this report is saved in DocumentDB, the GetData does is:

public async Task<ContentResult> GetData()
{
    JavaScriptSerializer serializer = new JavaScriptSerializer();
    string json = string.Empty;
    try
    {
        // this json has the time stamp attribute and Rows (array, which is what the grid shows)
        json = await _reportRepository.FindDocumentByQueryStringAsync(".....");
        if (!string.IsNullOrEmpty(json))
        {
            // convert the json
            ....

            List<ReportRow> rowList = new List<ReportRow>();
            ...
            {
                // parse the json, get results
                rowList = reportResults.Rows;
            }
            ...

            string ojson = serializer.Serialize(rowList);
            return this.Content(ojson, "application/json");
        }
    }
    catch (Exception ex)
    {
        _log.LogError("...");
    }
    return this.Content(json, "application/json");
}

When we show the report, we want to show the report's time stamp. My idea is: we can create another method in _reportRepository to return the report timestamp, call it in controller and pass to the view. But coworker asked: since we get the time stamp in GetData, is there a way we can use it, so that we do not have to change _reportRepository and make another call?

So, my question is: if in the GetData, we pass the json directly to Kendo grid, how should I make changes in the gridDataSource ? How we define the model in the schema? Or, the model in kendo has to be simple type, i.e. string, number, date, ...? If we can do that, what should I change in the read event?

I searched, but can not find the answer.

Thanks

Answer 1

My understanding is that there will be single timestamp information in the server's response, i.e. this information will not be shown in each Grid row. In this case, your scenario will require the use of schema.data and is similar to the second example here:

http://docs.telerik.com/kendo-ui/framework/datasource/crud#read-remote

The server response will look like this:

{
    "yourTimeStamp": "foo",
    "itemCount": 10,
    "items": [{
        "ProductID": 1,
        "ProductName": "Bananas"
    },{
        "ProductID": 2,
        "ProductName": "Pijamas"
    }]
}

The dataSource configuration should look like this (note the schema.data part):

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "url"
        }
    },
    schema: {
        data: "items",
        total: "itemCount"
    }
});

The final task is to extract the timestamp information, as it will be used outside the Grid rows. This can be done in a couple of ways:

• in the requestEnd event of the DataSource
• in the schema.parse function

On a side note, the Grid data items can also contain objects with nested fields, as demonstrated here:

http://demos.telerik.com/kendo-ui/grid/editing-custom

(the Category field)