Start Building Professional
Web Apps Today

dhtmlxTree

Can you suggest a way of saving/loading tree (Professional) open/closed states when the tree itself is refreshed at intervals with changing tree data that consists of server folders and files?

Eg tree is loaded with data as follows

onetree
-banana:yellow
--apple:green
---olive:black

Tree xml is generated from traversing the server folders and files.
Since there is no associated open/closed status on the server the xml is generated with folders closed ie collapsed.

Tree data is refreshed at regular intervals ( tree.smartRefreshBranch() ) and may change as eg apple:green -> apple:red
With normal tree operation: if the tree nodes are clicked opened and a refresh occurs then the nodes are closed/collapsed at the point where the folder or file name is changed - collapsed to the level above eg if apple:green -> apple:red then tree above becomes

onetree
+banana:yellow

If tree cookies are used then the same happens except it seems the tree brefly appears as above and then becomes.

onetree
-banana:yellow
-+apple:red

Note :
1 tree represents the server (a 'read mode' if you like)
2 folders with sub folders/files can be added to the server and on refresh seen in the tree
3 folder/file names can change in 'part' as per the eg apple:green -> apple:red

I considered creating a file/s on the server at each level, the name of which would indicate folder open status ie when a folder is clicked open. If click folder close then the file is deleted. Unfortunately this cannot be done using handlers for events onOpenStart (or onOpenEnd) as this is called repeatedly when the tree is refreshed at each interval. This then leaves event node select: this can be used to create/delete files from the server but unfortunately it is possible to click open/close using the + and - symbols and this is not picked up by node select. To block the use of clicking + and - it is possible to lock the tree but then node select no longer works.

So is there a way to preserve the tree nodes open/closed status:
1 during tree refresh when names may change (in part)?
2 on browser page reload?

No this is virtually what I tried and does not work.
And I assume should not work because I am
changing the name of a node (apple:green to apple:red).
which has been saved in the cookie ie it makes sense
for it not to work. But there must be away of doing this.

Note:
1. Node id = Display name ie both change
2 the node number does not change ie either they are all
there or not. The names only partly change and  that
must be enough to stop the cookies from working ie
would be nice if cookies took no notice of the node
name and just the tree structure but seems not.

Example tried with supplied code:-
Browser loads tree collapsed so :
1) I start with
+ontree

2) click to open all the nodes to give
onetree
-banana:yellow
--apple:green  <<< note name
---olive:black

3) I then rename (on the server) apple:green to apple:red and
(tree xml is created using server at set intervals) and on tree refresh
I see the tree collapse as follows:
onetree
+banana:yellow

4) If I click the nodes to open I then see

onetree
-banana:yellow
--apple:red   <<< note the change
---olive:black

We are back to the first question above:

Simply put: how can I - on opening/closing a tree node - write to the server to indicate this status change?

1 Events onOpenStart (or onOpenEnd) cannot be used as they are called repeatedly when the tree is refreshed at each interval i.e.loading a tree (xml would be defaulted with collpased mode) would result in writing all the tree status to the server - collapsed mode for each node.
2 This leaves event node select: and this can be used to open/close nodes and create/delete files from the server but unfortunately it is possible to click open/close using the + and - symbols and this is not picked up by node select. This can be overriden i.e. it is possible to lock the tree but then node select no longer works.

Hello,

the tree provides following features. Possibly they'll help:

- it is possible to serialize tree to the xml string:

tree.setSerializationLevel(true,true)
var str = tree.serializeTree();

- to pass data to the server you can use dhtmlxAjax component:

dhtmlxAjax.post(script,param1=value1&param2=value2,outputResponse);
function outputResponse(loader){
            if(loader.xmlDoc.responseXML!=null){
                tree.deleteChildItems(0)
                tree.loadXMLString(loader.doSerialization()) /*if you want to reload tree with received xml*/
           }
}

- open state can be set in the xml:

<item open="1" ...>....</item>

- event handler can be detached and then, if it's necessary, attached again:

var evH = tree.attachEvent("onOpenStart", doSomething)
tree.detachEvent(evH)