listview data in the parent-child relation format

4 posts, 0 answers
  1. Vadivel
    Vadivel avatar
    4 posts
    Member since:
    Jul 2015

    Posted 10 Sep 2015 Link to this post

    We have a scenario, where we have to show the listview data in the parent-child relation format. In the Parent row there should be a plus (+) symbol and on click of the plus symbol the child data should be opened. It’s basically group the data under the parent and show the child data on click of the plus symbol.

    Kindly suggest us the approach or the code to accomplish our requirement.

    Below sample code of my template for the listview without the parent-child relation and will have to modify the code to accommodate the new requirement.


    <script type="text/x-kendo-tmpl" id="template">
            <div class="left-body-container">
                <table id="doc-list" class="doc-list" width="100%">
                    <tbody>                   
                        # if (FolderName==null) { #
                        <tr id="tblRowFileItems" objectid="#:ObjectId#">
                            <td>
                                <listleft>
                                    <img src="#:ImagePath#" />

                                    <file-folder-names>
                                        <a data-role="button" href="GetDocumentContent?objId=#:ObjectId#" target="_blank" id="testa">#:DocumentName#</a>
                                    </file-folder-names>
                                    <br />

                                    <span class="details">
                                        #:DocumentSize# <span class="paddingLR10">|</span> #:DocumentCreatedDate# :
                                        # if (!(DocumentCreatedby==null)) { # <a href=""> #:DocumentCreatedby# </a> # } #
                                    </span>

                                </listleft>
                            </td>
                        </tr>
                        # } #
                    </tbody>
                </table>
            </div>
        </script>

    @(Html.Kendo().ListView<IndexModels>(Model)
                            .Name("listView")
                            .TagName("div")
                            .ClientTemplateId("template")
                            .DataSource(dataSource =>
                            {
                                dataSource.Read(read => read.Action("ReadDataonPaging", "Home").Data("additionalInfo").Type(HttpVerbs.Post));
                                dataSource.ServerOperation(true);
                                dataSource.PageSize(10);


                            })

                    .Pageable(pager => pager

                                     .PreviousNext(true)
                             )
                    )
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 12 Sep 2015 Link to this post

    Hello Vadivel,

     

    I am afraid that we do not have an example that suits your exact requirements. However if you have any specific questions regarding the built-in Kendo UI functionality, 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!
     
  3. Kendo UI is VS 2017 Ready
  4. Kumar
    Kumar avatar
    1 posts
    Member since:
    Jul 2015

    Posted 14 Sep 2015 in reply to Kiril Nikolov Link to this post

    Hi Kiril,

    So you mean the nested list view for two different data source is not possible?

     

    Regards

    Utkarsh

  5. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 16 Sep 2015 Link to this post

    Hi Kumar,

    Yes your understanding is correct. The functionality is not supported out of the box by the Kendo Web ListView widget.

    Regards,
    Alexander Valchev
    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