Hierarchy data not displaying records

4 posts, 1 answers
  1. Moiez
    Moiez avatar
    4 posts
    Member since:
    Jan 2015

    Posted 28 Jul 2015 Link to this post

    I have an MVVM application using Kendo Grid, and I want to display hierarchy (nested grid). I am trying to replicate this example but I am not able to display the hierarchy data. How can I get the hierarchy records to display?

    cshtml code:

    <div id="custOrderGrid"
            data-role="grid"
            data-resizable="false"
            data-navigatable="true"
            data-editable="true"
            data-pageable="false"
            data-scrollable="true"
            onscroll="true"
            data-detail-template="child-template"
            data-columns="[
                    { 'field': 'OrderID', 'title': '<b>Order #', 'width': 65 },
                    { 'field': 'LineNo', 'title': '<b>Line Number', 'width': 65 },
                    { 'field': 'ItemNo', 'title': '<b>Item Number', 'width': 65 },
                    { 'field': 'Desc', 'title': '<b>Description', 'width': 150 }
                ]"
            data-bind="source: orderSearchResults"
            style="height: 55%">
    </div>
     
    <script id="child-template" type="text/x-kendo-template">
        <div data-role="grid"
             data-bind="source: obj2"
             data-columns="[
        { field: 'name' },
        { field: 'oid' }
        ]"></div>
    </script>

     

    typescript code:

    orderSearchResults = new kendo.data.DataSource({
        schema: {
            model: {
                id: "OrderID",
                fields: {
                    LineNo: { type: "string" },
                    ItemNo: { type: "string" },
                    Description: { type: "string" }
                }
            }
        },
                data: [
                    {
                        OrderID: "L44ZX4", LineNo: "15", ItemNo: "*X1WCJH", Description: "CDF9X2XSB",
                        obj2: [{
                            name: 'a1',
                            oid: 1
                            },
                            {
                                name: 'b1',
                                oid: 2
                            },
                            {
                                name: 'c1',
                                oid: 3
                            }]
                    }
                ]
            });

     

    I don't see an error messages. How can I display the hierarchy records? See image file attached.

  2. Answer
    Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 29 Jul 2015 Link to this post

    Hello Moiez,

    Thank you for contacting Telerik Support.

    In order to show the detailGrid in the template, you will need to use the detailInit event to initialize the grid, as the detailTemplate is not bound with the MVVM, as when kendo.bind() is called the detail template is not yet present. Please check the following example and let me know if it helps:

    http://dojo.telerik.com/uRUWE

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Moiez
    Moiez avatar
    4 posts
    Member since:
    Jan 2015

    Posted 29 Jul 2015 in reply to Kiril Nikolov Link to this post

    Thank you, Kiril. That worked perfectly
  5. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 30 Jul 2015 Link to this post

    Hi Moiez,

    Happy to help.

    In case something else comes up, do not hesitate to contact us.

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready