jstree 3.0.2 dynamic tree always loading data from cache instead of making a fresh call to server

Question

I have a jstree. on load of the page the jstree populates fine from the server as it make a fresh call to server, but after that whenever I refresh the page it will always take the data from cache and not make a call to server , thereby always taking the old data to populate. I am using jstree 3.0.2 version. following is the code which generated the jstree on load of the page .

$('#tree').jstree({
'core': {
data:{
'url':'getjstree'   // this is the url which will get the json data from the server
}
}});

how do we solve this to get fresh data on each call, one solution which I earlier thought of using is the javascript code to hard refresh by calling

location.reload(true);

but that did refresh the json data but went into recursive call and thereby hanging the page. Please help how can we solve this issue.

score 5 · Answer 1 · answered Mar 22 '16 at 20:54

5

JSTree plugin saves tree state in browser's localStorage with key "jstree". So before calling jstree you should erase that key from localStorage, like this:

//Removes jstree cached state from localStorage
localStorage.removeItem('jstree');

$('#tree').jstree({
    'core': {
        data:{
            'url':'getjstree'
        }
    }
});

answered Mar 22 '16 at 20:54

André Bonna

807
8
13

2

This is working with latest version of jstree @good work #Andre – Prasannjit Jul 06 '16 at 09:37

score 2 · Accepted Answer · answered Aug 20 '14 at 13:31

2

using this solved the problem

$('#tree').jstree({
'core': {
data:{
'cache':false,
'url':'getjstree'   // this is the url which will get the json data from the server
}
}});

answered Aug 20 '14 at 13:31

Chetan

4,735
8
48
57

@Sam, take a look at my answer about cleaning localStorage. – André Bonna Mar 22 '16 at 20:58
Odd... This solution worked for me while @AndréBonna 's one didn't. – GigiSan Mar 23 '16 at 11:04

FernandoZ · Answer 3 · 2016-08-06T23:50:33.343

0

I just added a random parameter at the end of the url... like this

'url' : function(node){
    return "/myrequestpath?randParam="+getRandParam();
}
                                                }

I defined getRandParam to return a random number between 1 and 1000... It would probably have worked out better and being more robust if I had used a time stamp but this worked for me. Notice that I used the function version of url but it's the same idea (function works every time but the url may be set only once I don't know that for sure).

edited Aug 06 '16 at 23:50

answered Aug 06 '16 at 23:43

FernandoZ

439
6
13

BTW I think is more so a issue with AJAX requests than it is with the the JSTree. It shows up on the JSTree but the real issue is with AJAX. Take a look at http://stackoverflow.com/questions/367786/prevent-browser-caching-of-jquery-ajax-call-result – FernandoZ Aug 06 '16 at 23:55

score -1 · Answer 4 · answered Sep 11 '21 at 09:43

-1

Clear localstorage still works in 2021

answered Sep 11 '21 at 09:43

Rogerad

1
1

2

The only thing this "new" answer does is to repeat what half of the other answers are already saying, including the [accepted answer](https://stackoverflow.com/a/25406101/14267427). – Tyler2P Sep 11 '21 at 10:03

jstree 3.0.2 dynamic tree always loading data from cache instead of making a fresh call to server

4 Answers4