How to bind JSON child array to Kendo grid

Question

Let´s say I have the following JSON data, which is the response data of an HTTP service call...

{
    [ "container" : [ 
        { 
            "category" : "default", 
            "items" : [ 
                { "name" : "item-1" }, 
                { "name" : "item-2" } 
            ]
        } ]
    ]
} 

I want to bind the items array to the Kendo UI Grid, so I defined the following data source...

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "http://...",
            dataType: "jsonp",
            data: {
                Accept: "application/json"
            }
        }
    },
    schema: {
        model: ???
    }
});

I´ve absolutely no clue how to define the model schema because I couldn´t find any information on that particular binding scenario in the documentation.

Answer 1

In the response, you have defined container as an array but not sure if it might repeat. As far as I understand the actual data is items. Correct? If so, this is the minimum DataSource definition.

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url     : "http://...",
            dataType: "json",
            data: {
                Accept: "application/json"
            }
        }
    },
    pageSize : 10,
    schema   : {
        data: "container[0].items"
    }
});

NOTE: The response that you show doesn't look like a JSONP but a JSON. That's why I'm setting dataType as JSON.

Answer 2

Take a look at the example here which has what I think you are looking for.