DataSource - Binding Nested Array To Template

[Josh]

I have a data source that contains a single Order, the Order contains an array of Order Products, I am able to bind to the datasource.data and get the values of each field.

What I need to be able to do is bind a separate template to just the Order Products array from the Order data source.

I was thinking it could be something like:
The List View:
<div data-role="view" data-title="Order Details By Number" data-layout="main" data-model="APP.models.orderdetails_bynumber">
    <ul data-role="listview" data-style="inset" data-template="orderItemTemplate" data-bind="source: ds.data.OrderProducts"></ul>
</div>
The Template:
<script type="text/x-kendo-template" id="orderItemTemplate">
    <a data-bind="click: alert">#: PartNumber #</a>
</script>

I am able to do get the part number etc. if I specify the index of the product:
The List View:
<div data-role="view" data-title="Order Details By Number" data-layout="main" data-model="APP.models.orderdetails_bynumber">
    <ul data-role="listview" data-style="inset" data-template="orderItemTemplate" data-bind="source: ds"></ul>
</div>
The Template:
<script type="text/x-kendo-template" id="orderItemTemplate">
    <a data-bind="click: alert">#: data.OrderProducts[0].PartNumber #</a>
</script>

Which displays the first part number in the array.

Is there a way to accomplish what I am trying to do?


Josh

[Tsvetina]

Hello Josh,

From your description, it sounds like setting the DataSource's schema.data property to "Order.OrderProducts" will result in the desired behavior:

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

This property value should point to the name of the field in the response data that contains the data items.

Regards,
Tsvetina
Telerik