Dynamic tree and saveState about jqtree HOT 11 CLOSED

onGetStateFromStorage and onSetStateFromStorage allow you to override the loading and saving of the state. They are used in the unit tests.

So, if I understand you correctly, you want to restore the state of a dynamically loaded tree. Is this correct?

You mention that the state of the tree is not saved using localstorage or a cookie. I don't understand this. Do you think it would not work, or is there a reason you do not use localstorage?

Also, yes, if you can create a jsFiddle example, this would certainly help.

from jqtree.

Yes, i want to restore a dynamicly created tree. The full node isn't saved, just the node id. That is what i meant. So I could use those two events to implement my logic? Or aren't they called upon restore or save?

from jqtree.

Ok, I'll try that. I'll post my code as soon as I finishes it :) big thanks'

from jqtree.

When restoring the state, jqTree expects that the whole tree is loaded. Also, loading a subtree using ajax in the onGetStateFromStorage event would not work.

What I would do, is to restore the state myself. The problem is that jqTree has no function to get the state. But I could add a function for that.

from jqtree.

that would be very kind of you! :)

excuses for all the open/closed/reopens..

from jqtree.

I have added the function getStateFromStorage. This functions returns the open nodes and the selected node:

{"open_nodes":[1,8,23],"selected_node":2}

The function is added to the get-state branch (https://github.com/mbraak/jqTree/tree/get-state).

from jqtree.

-- old
I currently kind of took out your restoreState function on the SaveStateHandler and worked with that to preload my partial tree before initializing the jqtree. Seems to work. :)

-new
on a page reload the tree ain't initialized yet, how to I call your function when it is referring of to it's own internal functionality?

from jqtree.

I got it all working currently:
I did however had to modify your script a bit:

• I had to include the level of the node in the stateSave functionality, this will allow me to reconstruct the correct level.
• I had to change your indexOf method to be able to work with the extra properties on the saved objects.

futhermore I loaded my state just before the tree initializes, this from outside your plugin/widget. This was done by passing the savedState (if present) as a parameter to my method that handles the initial loading of the first levels. The backend handles the rest and returns either only the first levels (if no savedstate was passed) or a partial tree (if a state was passed )

Now I just need some sort of mechanics to avoid firing extra queries when nodes are open/closed a couple of times without leaving the page. Should be easy by added a 'fetched' property of some sort. :)

from jqtree.

Very interesting. Can you share your code if it is finished?

from jqtree.

My script: http://jsfiddle.net/h8G3b/1/ (non runnable code)

Adjusted code parts on your script: http://jsfiddle.net/WkXwp/1/ (non runnable code)

It's in c# MVC3 so my view only contains:

<div id="dataTree" data-treename="buildingtree" data-get-url="@Url.Action("GetBuildings", "Buildings")" >

treelevels are: building => floor => zone => room

with treename being the unique reference for the cookie/localstorage value and the get-url to contact my controller and receive the required JSON. As you can see in my script, I add a parameter to the GetJSON if a savedState is present.

Based on that parameter, my backend reactis accordingly an returns either a partial tree or a toplevel only tree. With the "tree.open" event I load all my ajax calls for the sublevels. The url or location where the script should go is added as a data attribute on the node object.

In c# my object looks like this:
public class NodeModel
{
public string id { get; set; }
public string label { get; set; }
public string GetUrl { get; set; }
public bool isGhost { get; set; }
public int level { get; set; }
public bool fetched { get; set; }
public IList children { get; set; }
public IList Actions { get; set; }
}

The ActionModel:
public class ActionModel
{
public object Link { get; set; }
public object Image { get; set; }
}

By using anonymous objects and the power of JQuery this is automatically mapped on html elements. Kind of cool once your realise it's potential :)

from jqtree.

Thank you the code.

I'm currently looking at a way to provide better support for loading nodes on demand; a better solution than the 'phantom' node trick.

from jqtree.