how to access datasource child

2 posts, 0 answers
  1. Federico
    Federico avatar
    21 posts
    Member since:
    Oct 2017

    Posted 25 Oct 2017 Link to this post

    how to access datasource child.

     

    <div id="a" data-role="grid"
                            data-toolbar="['excel']"
                            data-excel='{fileName: "ok.xlsx", proxyURL: "http://demos.telerik.com/kendo-ui/service/export",filterable: true}'
                            data-editable="false"
                            data-selectable="true"
                            data-filterable="true"
                            data-columnMenu="true"
                            data-groupable="true"
                            data-pageable='{ "pageSize": 10}'
                            data-reorderable="true"
                            data-resizable="true"
                            data-sortable="true"
                            data-height="550"
                            data-no-records= "true"
                            data-detail-template="templateSubGrid"
                            data-columns="[
                                        { 'field': 'a.nome','title':'nome'},
                                        { 'field': 'a.stato','title':'stato'}
                                         ]"
                            data-bind="source: GridSource,events:{detailInit: onDetailInit}">
            </div>
            <script id="templateSubGrid" type="text/x-kendo-template">
                <h4>ciao ciao </h4>
                <div id="Subgrid"
                    data-role="grid"
                    data-bind="source: GridSource.b"
                    data-columns="[
                           { 'field': 'name','title':' name'},
                        { 'field': 'company','title':'company'},
                    ]">
                </div>
            </script>

    JS:

     

     

    this.vm = kendo.observable({
                Grid:Source:[],
                onDetailInit:function(e){
                       var dataItem = $("#Subgrid").data("kendoGrid").dataItem(e.masterRow);
                    kendo.bind("#Subgrid", dataItem);
                }
            });
            kendo.bind($("#m"), this.vm);
    //GridSource is filled with the ajax function

     

    The response is like this:

     

       
          "a":{ 
             "idName":1,
             "name":"abbi",
          },
          "b":[ 
             
                "idSurname":2,
                "surname":"24353453252",
             },
             
               "idSurname":3,
                "surname":"fghgfhjk",
             },
             
                "idSurname":4,
                "surname":"24ssdfds3252",
             }
          ]
       }
    ]

    'b' must be the data source of the detailtemplate grid.

     

     

     

  2. Martin
    Admin
    Martin avatar
    833 posts

    Posted 27 Oct 2017 Link to this post

    Hi,

    Let me know whether this DoJo example works as expected for your scenario.

    Regards,
    Martin
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top