Best practice for modeling collection properties

2 posts, 0 answers
  1. Brett
    Brett avatar
    25 posts
    Member since:
    Sep 2012

    Posted 20 Dec 2012 Link to this post

    Hello all,

    I am struggling with the best way to model collection properties for a used in a, and configure it is such a way that data-bind attributes understand. For example, say my view model looks like this:

    var entityModel ={
      id: 'Id',
      fields: {
        Id: { editable: false, defaultValue: '00000000' },
        Name: {},
        Created: { type: 'date' },
        Contract: {
          StartDate: { type: 'date' },
          EndDate: { type: 'date' },
          Received: { type: 'date' }
        Vendor: {
          Name: {},
          Street: {},
          City: {},
          State: {},
          Zip: {},
          Phone: {},
          Email: {}
        Invoices: []
    var entityDataSource = new{
      schema: {
        model: entityModel
      transport: {

    As you can see, the Invoices property is an array - a collection of invoices. How do I get the DataSource to understand this, and how would I bind Invoices to the view? Would this work?
    <div data-template="invoiceTemplate" data-bind="source: Invoices"></div>
    What if I wanted to represent this collection of Invoices as a kendoGrid which I could add, edit, and delete from? Is this functionality supported out-of-the-box or will I need to create a separate Invoice DataSource?

    Thanks for any assistance you can provide.
  2. Atanas Korchev
    Atanas Korchev avatar
    8462 posts

    Posted 24 Dec 2012 Link to this post

    Hi Brett,

     This functionality is currently not supported out of the box. A model field can only be of a primitive JavaScript type - String, Number or Date.

     If you want to display a master/detail grid you need a separate data source for the detail grid. You can check the following demo for further details:

    Atanas Korchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top