How to save the expanded state of Kendo Treelist

11 posts, 0 answers
  1. Diwakar
    Diwakar avatar
    2 posts
    Member since:
    Jan 2015

    Posted 27 Jan 2015 Link to this post

    I need to save the expanded/collapsed state of Kendo UI Treelist so that nodes are expanded when I visit another page and come back.

    It can be done for Treeview but not able to replicate the same. (http://jsfiddle.net/lhoeppner/rwfsf/)
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 29 Jan 2015 Link to this post

    Hello Diwakar,

    Persisting is not supported out of the box, however you can find all the collapsed row by searching for the k-expand icon inside the TreeList and then when the page is reloaded you can use the collapse method to collapse those rows.

    Here is an example:

    http://dojo.telerik.com/@pesho/uGaZI/2

    Kind Regards,
    Petur Subev
    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. jamana
    jamana avatar
    7 posts
    Member since:
    Jul 2016

    Posted 19 May 2020 in reply to Petur Subev Link to this post

    Hi,

    Is it possible to persist table header data as well, which is similar to getOptions and setOptions in kendo grid? Below is the example persisting at grid level. Can we achieve the same with Kendo tree list as well?

    https://demos.telerik.com/kendo-ui/grid/persist-state

    Thanks,

    Ramesh

  4. Silviya Stoyanova
    Admin
    Silviya Stoyanova avatar
    66 posts

    Posted 21 May 2020 Link to this post

    Hello Jamana,

    I am afraid that the getOptions() and setOptions() methods are not implemented for the TreeList widget.

    There is already logged a Feature Request in the Feedback Portal for adding getOptions and setOptions in the TreeList.  I have already voted on your behalf and  track its progress at the following link:

    Could you elaborate further on the desired behavior, so I would try to provide a reasonable solution?

    Finally, I noticed that you have posted a similar question in this forum thread and I would like to ask you to avoid posting duplicate questions.

    I am looking forward to your reply.

    Kind Regards,
    Silviya Stoyanova
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  5. jamana
    jamana avatar
    7 posts
    Member since:
    Jul 2016

    Posted 21 May 2020 in reply to Silviya Stoyanova Link to this post

    Thank you Silviya Stoyanova for the response.

    Our requirement is to create custom views for a kendo treelist. User can select the list of columns (by hiding unrequired columns), change width of the columns, column reordering, applying sorting and filtering.... and should able to save the grid configuration. This information we have to store in the DB (not in local storage, may be as a JSON converted string into DB) and user can get the grid loaded as and when he needed by selecting the custom view name.

    Note: we do have nested columns in the kendo tree list header.

    I have tried by converting the $("#grid").data("kendoTreeList").columns to kendo.stringify which is throwing "circular structure to JSON" for the "parentColumns" parameter. So I could not able to proceed with this option.

    Apologies for the lengthier mail.

    Looking forward for your support to give a workaround for this problem.

     

    Thanks,

    Ramesh

  6. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1082 posts

    Posted 25 May 2020 Link to this post

    Hi, Jamana,

    Until the getOptions()/setOptions() methods are implemented, we cannot offer a solution that will work in all cases.

    I tested the suggestion from the the other forum thread and indeed, it threw a circular error.

    One way to handle this could be to remove the property that causes the error programmatically by deleting the parentColumn property before stringifying:

    http://dojo.telerik.com/itEnUdIC/3

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  7. jamana
    jamana avatar
    7 posts
    Member since:
    Jul 2016

    Posted 25 May 2020 in reply to Alex Hajigeorgieva Link to this post

    Thank you for a solution. 

    When I have applied the solution to my code, I am getting following error at treeList.init(element, options) statement.

    kendo.all.min.js:90 Uncaught TypeError: t.style.split is not a function
        at t (kendo.all.min.js:90)
        at init._columnAttributes (kendo.all.min.js:90)
        at init._columns (kendo.all.min.js:90)
        at init (kendo.all.min.js:89)

    Can you please suggest what is causing the issue?

    Thanks,

    Ramesh

  8. Silviya Stoyanova
    Admin
    Silviya Stoyanova avatar
    66 posts

    Posted 27 May 2020 Link to this post

    Hello Jamana,

    This error is caused by applied columns.attributes property. Remove it if you could afford it.

    I am afraid we can not propose a custom solution until the setOptions() functionality is implemented. 

    We find an alternative way to escape the circular error by using the workaround proposed in the Mozilla documentation, but after that, another error occurred - "Maximum call stack size exceeded", which is caused by jQuery's internal extend method that we can not handle.

    Sadly we cannot offer an alternative to meet the full requirements in this case.

    I hope that we could propose soon built-in functionality and such cases will be resolved on the fly. 

    Kind Regards,
    Silviya Stoyanova
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  9. jamana
    jamana avatar
    7 posts
    Member since:
    Jul 2016

    Posted 28 May 2020 in reply to Silviya Stoyanova Link to this post

    Okay. I have started writing my own custom logic for persisting the column header status. 

    I am facing only challenge in setting up column reordering due to the multi-column header.

    Is there away to use "grid.reorderColumn()"method to set cell indexes of multi-columns?

    Thanks,,

    Ramesh

  10. Silviya Stoyanova
    Admin
    Silviya Stoyanova avatar
    66 posts

    Posted 01 Jun 2020 Link to this post

    Hello Jamana,

    The TreeList widget has its own reorderColumn() method that is used to change the position of a specified column by setting a new destination index.

    You could see that it is also applicable for multi header columns: https://dojo.telerik.com/@Silvia/epexUcAm

    Kind Regards,
    Silviya Stoyanova
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  11. Sivaramakrishna Reddy
    Sivaramakrishna Reddy avatar
    7 posts
    Member since:
    Mar 2020

    Posted 03 Jun 2020 in reply to jamana Link to this post

    Hi, Could you share the logic for persisting the column header status for TreeList? 
Back to Top