Data Source with complex object

[Albert]

I followed the tutorial, part 2 hello services. I wanted to extend the example and use it in a real world app that I am putting together. But I am having a issue. Here is my json data returned from my service:

[{"CustomerId":"60506","CustomerName":"WILLIAMS COMFORT AIR          ","PartNumber":"34.120.           ","Vnd":"PV","SellPrice":"       1.45","UM":"EA ","Branches":[{"Id":2,"AvailQty":0,"Status":"A","Location":"St. Louis"},{"Id":3,"AvailQty":100,"Status":"A","Location":"Paducah"},{"Id":4,"AvailQty":138,"Status":"A","Location":"Ft. Wayne"},{"Id":5,"AvailQty":685,"Status":"A","Location":"Indianapolis"},{"Id":6,"AvailQty":185,"Status":"A","Location":"Louisville"},{"Id":7,"AvailQty":132,"Status":"A","Location":"Lexington"},{"Id":8,"AvailQty":2,"Status":"A","Location":"Evansville"}]}]

Here is my js:

<script>
    var dataSource = null;

    $(function () {

    });

    function Lookup() {
        var customer = $("#customer").val();

        if (customer == "") {
            customer = "60506";
        }

        dataSource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "api/part/",
                    data: {
                        partnumber: $("#part").val(),
                        customer: customer
                    }
                }
            }
        });

        dataSource.read();

        $("#partsGrid").kendoGrid({
            groupable: true,
            sortable: true,
            dataSource: {
                data: dataSource.data()[0].Branches,
                schema: "Branches"/*{
                    model: mySchema
                }*/
            }/*,
            columns: [{
                field: "CustomerId",
                title: "Id"
            }, {
                field : "CustomerName",
                title : "Name"
            }]*/
        });
    }
</script>

I want the datasource in an external var so I can ref other bit of information in it. In the end, I want a page with the customer name and customer id and the grid with each branch location and available quantity. Everything I've been reading suggest the datasource can not be a complex object. Is this true? What would be the best approach for me to take to get my results?

Thanks!

[Daniel]

Hello Albert,

The data is probably not loaded yet when assigning the Grid dataSource data. You should use the dataSource change event instead to create the Grid or set its data. I created a small jsBin example that demonstrates this scenario.
Also, note that the dataSource schema option should be an object.

Regards,
Daniel
Telerik