How to save the expanded state of Kendo Treelist

[Diwakar]

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/)

[Petur Subev]

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

 

 

[jamana]

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

[Silviya Stoyanova]

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:

• https://feedback.telerik.com/kendo-jquery-ui/1359674-treelist-setoptions-getoptions

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

[jamana]

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

[Alex Hajigeorgieva]

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

[jamana]

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

[Silviya Stoyanova]

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.

• https://dojo.telerik.com/AcUkUZoQ

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

[jamana]

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

[Silviya Stoyanova]

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

[Sivaramakrishna Reddy]

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