Treeview and custom expanding js function

2 posts, 1 answers
  1. Alberto
    Alberto avatar
    71 posts
    Member since:
    May 2012

    Posted 18 Jun 2014 Link to this post

    Hi guys...
    I have a complex situation here.

    I have a treeview loaded with remote data on server 
    (exactly the same of your example) and so I have an mvc anction with a nullable id that returns the child of the selected node.
    Now in the normal scenario the tree starts with all node collapsed.
    The problem is that I need to provide a way to load the page, and the tree as well, with a particular node loaded.

    Here my tree:
    @(Html.Kendo().TreeView()
        .Name("DataSetTree")
        .TemplateId("ClassifierTreeTemplate")
        .DataSource(dataSource => dataSource
            .Read(read => read
                .Action("Index", "DataSet").Type(HttpVerbs.Post)
            )
        )
        .Events(e =>
        {
            e.Change("OnTreeChange");
            e.DataBound("OnDataBound")
        })
    )

    I don't provide the action cause it is a bit complex and misleading since I get the data from 3 different tables...
    anyway...It works perfectly...

    now, I tried to pass the parameter to the actual treeview view (mcv) (success) and then pass it the to client (js)

    I guess I need to open the node client-side...and sometimes the selected node could be up to the 9 level deep...
    the problem is: if I pass the id (of the node) as an argument of the DataBound event, this event fires when the treeview is not rendered yet.
    (while if I attach the event handler as you see on the code I provided, it fires when the rendering is compleated) that's weird...
    so..How can I achieve what I need? there's no other event that fires "on Compleate", right?
    Can I pass my parameter and have the event fire In the right moment?


    I hope I made myself clear.
    thanks
    Fabio




  2. Answer
    Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 20 Jun 2014 Link to this post

    Hi Fabio,

    Basically this behavior would require custom solution which depends entirely on you and the exact setup that you have. For example after the page is loaded (in case the TreeView use Ajax binding, and only the first level is initially loaded) you can search the for the needed node. If the node is not available in the current level you can expand the next level of nodes and search again. This operation can be executed several times until the node is found or the TreeView is fully loaded. Please check the example below:
    Also possible optimization would be if the node is not found on current level to create custom Ajax request to the server which to return the path to the needed node in form of array of node ids. Then you can expand the path until current node is available.

    Regards,
    Vladimir Iliev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top