TreeList Filtering On Hidden Nodes

4 posts, 0 answers
  1. Neil
    Neil avatar
    3 posts
    Member since:
    Jun 2014

    Posted 04 Aug Link to this post

    Hi,

    I have a requirement to have a TreeList which has up to 4 levels. I have the filter option enabled which gives me a filter to say Contains 'xxxxx' for example. When the treelist first loads it loads with all nodes closed. When I apply the filter it only filters on what is shown directly in the view, so in this case on the top level items. Is there a way that it can filter on any child node as well, such that if a level 4 child node contained 'xxxx' for example it would show the item expanded with the various parent nodes?

    I can set it so that the view is always expanded, but then each time the view is rebound any user alterations to the expanded state are overriden by the expansion. 

    Thanks,

    Neil

  2. Stefan
    Admin
    Stefan avatar
    1365 posts

    Posted 08 Aug Link to this post

    Hello Neil,

    Based on the provided information I can assume that the data is loaded on demand when the expand arrow is clicked.

    If my assumption is correct this is expected because the filter can be applied only to the currently available data. Still, when a node is expanded, the filter will be automatically applied to the new data as well. This can be observed in the Dojo example(the MVC behaviour is the same):

    http://dojo.telerik.com/asIROc

    If all of the data is available, then the filter should be applied to all nodes regardless of their expand or collapse status, as the filter is performed on the dataSource, not to the visible part of the TreeList.

    In case, the described expected results are different in the real application, please provide a fully runnable example, and I will gladly assist.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Neil
    Neil avatar
    3 posts
    Member since:
    Jun 2014

    Posted 08 Aug in reply to Stefan Link to this post

    Hi,

    In my code the whole dataset is loaded. See http://demos.telerik.com/kendo-ui/treelist/index as an example, all the data is loaded. Now collapse the tree (so only Daryl is shown) and search for one of the contained people. The state of the expansion overrides the search meaning that if I search for say Ursula, I still only see Daryl, so unless every node is already expanded on a tree the search doesn't work. Also note that in your dojo example elements are loaded on demand, but in the example http://demos.telerik.com/kendo-ui/treelist/index this is using the /All extension on the service URL (which I assume returns all records) - hence the difference (see your updated dojo - http://dojo.telerik.com/asIROc/4) and now search for Ursula and note that nothing happens. The expected behavior would be that the nodes expand to show Ursula. 

    Many thanks,

    Neil

  4. Stefan
    Admin
    Stefan avatar
    1365 posts

    Posted 10 Aug Link to this post

    Hello Neil,

    Thank you for clarifying the desired result.

    I can suggest a custom approach which will help to achieve the desired result. It will require checking if there is a filter in the TreeList, and if it does to manually expand the nodes in order to show the filter results:

    http://dojo.telerik.com/asIROc/5

    http://docs.telerik.com/kendo-ui/api/javascript/ui/treelist#methods-expand

    http://docs.telerik.com/kendo-ui/api/javascript/ui/treelist#events-dataBound

    Please have in mind that the discussed functionality is filter, and its purpose is to filter the data, so only the nodes(and their parents) which match the criteria will be left on the screen. The design behaviour is different than a search and that is why the records are not automatically expanded.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top