locked
TreeView using Kendo RRS feed

  • Question

  • User1308732545 posted

    Hi All,

    I am using Kendo Treeview with MVC, Now My requirement is
    On the left hand side I have a treeview , on selection of a node , the details of that object should be displayed on the right hand side
    My code looks like this below , But the problem is the select event is not firing at all , in the Chrome console , there is this error "onselect  not defined" Could any one please help me on this.

    @(Html.Kendo().TreeView()
        .Name("treeview")
        .DataTextField("Name")
        .DataSource(ds => ds.Read(read => read.Action(Model,"Hierarchy")))
        .Events(events=>events.Select("onSelect")))
    
    
    
    <script type="text/javascript">
        
        function onSelect(e) 
        {
           var data = $('treeview').data('kendoTreeView').dataItem(e.node);
           console.log(data.id);
        }
    </script>

    Thanks

    Tuesday, October 11, 2016 9:40 AM

All replies

  • User283571144 posted

    Hi gowrifor.net,

    On the left hand side I have a treeview , on selection of a node , the details of that object should be displayed on the right hand side
    My code looks like this below , But the problem is the select event is not firing at all , in the Chrome console , there is this error "onselect  not defined" Could any one please help me on this.

    According to your codes, I couldn't see any error.

    Kendo Treeview demo:http://demos.telerik.com/aspnet-mvc/treeview/events

    Besides, I suggest you could try to create a JS function to test it.

    More details, you could refer to follow codes:

    <div id="treeView"></div>
    $(document).ready(function() {
        var data = new kendo.data.HierarchicalDataSource({
            transport: {
                read: {
                    url: "http://demos.kendoui.com/service/Employees",
                    dataType: "jsonp"
                }
            },
            schema: {
                model: {
                    id: "EmployeeId",
                    hasChildren: "HasEmployees"
                }
            }
        });
        $("#treeView").kendoTreeView({
            dataSource: data,
            dataTextField: "FullName",
            select: onSelect
        });
        
        function onSelect(e){
            var item = e.node;
            var parent = this.parent(item);
            // Prevent the default action of treeview "select" event i.e. prevent selecting itself
            e.preventDefault();
            // At this point i am selecting parent only, you can select parent hierachy upto root element using "parent" recursively
            this.select(parent);
            alert("Node Text: " + this.text(item) + " and its parent: " + this.text(parent) || "Root");
        }
    });

    If you have more question about using Kendo TreeView, I suggest you could also post it in below forum.

    Link:http://www.telerik.com/forums/aspnet-mvc/treeview

    Best Regards,

    Wednesday, October 12, 2016 3:05 AM