Grid schema collection property

[Jesse]

My model has a property that is a collection.  The collection can have any number of codes.  eg CPT, Rev, ...  If CPT is present in the collection I would like its code to be put in a CPT column and the same for any other codes.

Here is an example of my json from my WebAPI.
{
Data: [
  {
     ServiceId: 1,
     BillingCode: "123456789",
     Description: "Broken Arm",
     ChargeAmount: 2.15,
     Department: null,
     Codes: [
         {
         CodeType: "CPT",
         CodeNumber: "1234"
         },
         {
         CodeType: "Rev",
         CodeNumber: "5555"
         }
    ]
  },
  {
    ServiceId: 2,
    BillingCode: "2",
    Description: "Broken Leg",
    ChargeAmount: 4.5,
    Department: null,
    Codes: [
       {
       CodeType: "HCPC",
       CodeNumber: "4543"
       }
    ]
  }
  ],
 Count: 2
}

I would like the columns to be:
Billing Code | Description | Charge Amount | Department | CPT | Rev | HCPC

        dataSource: new kendo.data.DataSource(
            {
                transport: {
                    read: "api/Codes"
                },
                pageSize: 5,
                serverPaging: true,
                schema:
                    {
                        data: "Data",
                        total: "Count"
                    }
            }),

Is what I have so far and I can get everything filled in except the codes.

[Alexander Valchev]

Hi Jesse,

I am afraid that what you would like to achieve is not supported out of the box. The DataSource is designed to operate with flat data which is why the "Codes" are not displayed. Please bind the grid to a flat data structure and let me know if the problem still persists.

Kind regards,
Alexander Valchev
the Telerik team

[Jesse]

I ended up doing something like this.
{
           title: "CPT",
            template: '# $.each(Codes, function(data) { # #if(this.CodeType === "CPT") {# #= this.CodeNumber # # }}); #'
        }, {
            title: "Rev",
            template: '# $.each(Codes, function(data) { # #if(this.CodeType === "Rev") {# #= this.CodeNumber # # }}); #'
        }, {
            title: "HCPC",
            template: '# $.each(Codes, function(data) { # #if(this.CodeType === "HCPC") {# #= this.CodeNumber # # }}); #'
        },

However doing this means the grid will not allow you to filter those columns and this is also hard coded and does not allow for user generated code types.

Thank you for your help.