We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to maintain the state of TreeView nodes on page refresh?

Platform: ASP.NET MVC (Classic) |
Control: TreeView |
Published Date: February 9, 2015 |
Last Revised Date: February 9, 2015 |
Product Version: 12.4.0.24

Description

The state of the TreeView nodes are changed to default when the page is refreshed or on any post-back operations. You can maintain the state of nodes by restoring the data from browser cookies.

Solution

In order to maintain the state of TreeView after rebinding the source or on page refresh, you can store the TreeView node state in client-side script on every TreeView action and restore them back on TreeView load. Using the jQuery cookies function you can store the value in browser cookies, so refer the jQuery cookies script in your application.

Now define a script function to store the expanded and selected TreeView nodes in variables respectively and assign the function to ClientSideOnNodeExpand, ClientSideOnNodeClick and ClientSideOnNodeCollapse events. Similarly define a function to restore the state of TreeView and assign it to ClientSideOnLoaded event. So that the TreeView changes are stored using the client-side events and restored from cookies.

CSHTML

Client-side JavaScript

Controller, C#

 

Refer the following online demo for references,

http://mvc.syncfusion.com/demos/ui/tools/TreeView/StatePersistence

ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon