Expand Parent Row and Select Previously Selected Row

2 posts, 0 answers
  1. Matt
    Matt avatar
    87 posts
    Member since:
    Mar 2009

    Posted 03 Feb 2017 Link to this post

    During user operations, we refresh the datasource contents and reload the treelist.  If our users have a row selected, we need to reselect that row.  If a child row was last selected, we need to expand its parent and select the child.  I've looked through the docs, but all it shows is how to select a row based on the index; I also see nothing on how to expand the parent of a child row.

    You can see my code in this dojo:  http://dojo.telerik.com/epOQe/3

    After running it, select a row and then click the Refresh button; the point is that the selected row should be selected after the refresh *and* if be visible (e.g., if it's a child node, the parent should be expanded as well).  The selected row remains selected, but if it's a child row, the parent row won't be expanded.  (I based this off the code found here.)

    So my questions are thus:

    1) Why won't the parent row expand?

    2) Is there a way to automatically expand the parent when a child is selected?

    Any guidance would be greatly appreciated!

  2. Tsvetina
    Tsvetina avatar
    2481 posts

    Posted 07 Feb 2017 Link to this post

    Hi Matt,

    Your code is actually valid, there is just a small typo that you masked with the try-catch block:
    $("#treeList").data("kendoTreeList").expand(tableRow); //#treelist must be all lowercase

    Here, you are actually not able to access the TreeList element with this selector, but you see no error because of the try-catch structure (and no alert in the catch block). If you fix this, the row get expanded and the selected child is visible.

    There isn't an automatic way to expand the row, so your custom approach is the way to go in this case. And a quick advice—it is better to get a reference to the TreeList widget once and use it throughout the code in your expandRow method. This is faster, easier to read and makes your code less prone to errors like the above one.

    Let me know if you have additional questions.

    Telerik by Progress
    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