Bind Dynamic JSON Object to Kendo Grid

Question

I have a JSON object returned from a DataSet as below.

I use a DataSet rather than EF Model as the SQL query returns dynamic data. So the columns could be anything any time the query is called.

{
  "Table": [
    {
      "Entity": "SP00",
      "Period": "2017-08-31T00:00:00",
      "Level": "Level 5",
      "Errors": "Approved",
      "Process": "Created"
    }
  ]
}

I want to populate a Kendo UI Grid with this object. Here is my Kendo code...

self.GetTaskRecordOverviewTEST = function () {
        $.getJSON(apiurl + 'task/GetTaskRecordsOverview', { Period: Period }, function (taskRecordData) {
            $("#TESTdashboardOverviewGrid").kendoGrid({
                dataSource: {
                    data: taskRecordData.data.Table
                }
             })
        });
    };

However, I get the error "Unable to get property 'Table' of undefined or null reference".

Any idea what is wrong with my code?

score 1 · Accepted Answer · answered Sep 19 '17 at 17:05

The error indicates that your taskRecordData.data is null, you need to check whether your code is returning a proper data.

and here is the link on how to populate dynamic columns in Kendo Grid:

http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/various/create-with-dynamic-columns-and-data-types

Good luck!

Bind Dynamic JSON Object to Kendo Grid

1 Answers1