Nested DataSources and TreeView

7 posts, 0 answers
  1. Ivan
    Ivan avatar
    1 posts
    Member since:
    Dec 2012

    Posted 15 Apr 2013 Link to this post

    Hi,

    i am having trouble with the Hierarchical Data Source in conjunction with the TreeView and nesting. The goal is to show a treeview with root items like "employees", "profiles" and sub items being the acutal items. So every root item is using a different data source. This is not working, as the root nodes are not expanding while the data source seems to load perfectly.
    I have prepared a small fiddle to show the problem: http://jsfiddle.net/ruapho/GaFd6/4/

    Any ideas?
  2. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 17 Apr 2013 Link to this post

    Hello Ivan,

    I posted my reply in the support ticket on the same topic. For convenience I am pasting it below:

    This is not supported. You should use a single child dataSource and determine which items to be loaded based on the ID that is passed to the read method. I have updated the jsFiddle to show this approach.

    Regards,
    Daniel
    the Telerik team
    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. Eric
    Eric avatar
    3 posts
    Member since:
    Nov 2013

    Posted 04 Mar 2014 Link to this post

    I just ran into this issue today.  Until now, I hadn't seen that this wasn't possible.  I thought it would be okay because the documentation for HierarchicalDataSource shows how to chain them.  I replaced with homogenous and now all is well.  Perhaps the control could throw an error if you attempt this and/or have it documented under dataSource for kendo.ui.TreeView?

    Error details:
    In my case, it was throwing an error in kendo.custom.min.js on:
    o=s.aggregate,l=s.field,e[l]=e[l]||{},e[l][o]=L[o.toLowerCase

    o.toLowerCase fails because o is undefinied.  It appears that s exists but the "aggregate" property does not.  I was assuming it was the datasource property, but setting that didn't seem to do anything for me.  
  5. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 06 Mar 2014 Link to this post

    Hello,

    Could you provide the setup that you tried to used and explain the problem in more detail? The issue discussed here is about configuring a different dataSource for each root node.

    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Eric
    Eric avatar
    3 posts
    Member since:
    Nov 2013

    Posted 07 Mar 2014 in reply to Daniel Link to this post

    I'd need to dig up the server side methods from source control.  Going with one data source did work.  The return from both server side ajax calls were the same schema (TreeViewItem kendo .net).  I did use fiddler and verify that the data from the child call was coming back to the client.  

    <div id="treeView"></div>

    <script type="text/javascript">
        function commonParse(response)
        {
            return $.map(response, function(x) {
                x.expanded = x.Expanded;

                return x;
            });
        }
        
        function ready() {
            var dataSourceThreats = new kendo.data.HierarchicalDataSource(
                {
                    transport: {
                        read: {
                            url: ROOT_PATH + "Components/Threats",
                            dataType: "json",
                            type: "POST"
                        }
                    },
                    schema:  {
                        parse: commonParse,
                        model: {
                            id: "Id",
                            hasChildren: "HasChildren",
                            //children: "Items"
                        }
                    },
                    aggregate : null
                }
            );
            var dataSourceThreatsStatus = new kendo.data.HierarchicalDataSource(
                {
                    transport: {
                        read: {
                            url: ROOT_PATH + "Components/ThreatsStatus",
                            dataType: "json",
                            type: "POST"
                        }
                    },
                    schema: {
                        //data: "Items",
                        parse: commonParse,
                        model: {
                            id: "Id",
                            hasChildren: "HasChildren",
                            children: dataSourceThreats
                        }
                    }
                }
            );

            
                
            var kendoTreeView = $("#treeView").kendoTreeView({
                dataSource: dataSourceThreatsStatus,
                dataTextField: "Text",
                dataUrlField: "Url",
                dragAndDrop: false,
                expand: onExpand,
                loadOnDemand: true
            });
    </script>
  7. Eric
    Eric avatar
    3 posts
    Member since:
    Nov 2013

    Posted 07 Mar 2014 in reply to Eric Link to this post

    The output of both method calls (Threats and ThreatsStatus) were Json(IList<TreeViewItem>)
  8. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 11 Mar 2014 Link to this post

    Hello,

    The problem will occur because the children configuration option is set to a HierarchicalDataSource instead of an object with the HierarchicalDataSource configuration. The children options are used to initialize the node children dataSource when the children are loaded and so only the options instead of an instance should be set as demonstrated in the demos and the documentation.


    Regards,
    Daniel
    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