Binding a complex object to Grid

[Krishna]

Hello,

I have been trying to bind a json response to the grid. Essentially each record has an array of files that need to be show as a comma separated list on the last column. 

JSon response:  

[{"Id":"1","Title":"Sample","Description":"This is a sample","IsActive":"1","CreatedBy":"1","DocumentCategoryId":"1","files":
[{"filepath":"\uploads/download_assets/download1.jpg","doctypeext":"jpg","IconPath":"uploads/icons/icon-jpg.png"}]
}]

Script:

<script>
$(document).ready(function() {
  var dataSource = new kendo.data.DataSource({
   transport: {
    read: {
     url: "", // the remote service url
     dataType: "json"
    }
   }
  });
 
  $("#grid").kendoGrid({
   dataSource: dataSource,
    height: 360,
    groupable: false,
    scrollable: true,
    sortable: true,
    pageable: true,
    columns:[
    {
    field: "Title",
    title: "Title"
    },
    {
    field: "Description",
    title: "Description"
    },
    {
    field: "files",
    title: "Files",
    template: "#= files #" // Obviously this is incorrect.
    }
    ]
  });
});
</script>