how to reload a treepanel by defferent parameter?

[woog]

I have a treepanel,which at the top of it place a combobox toolbar.
when combobox selected send a selectedvalue .
like this:

 comboboxtree.on("select",function(){
     var selectvalue=this.getValue();
     myTreeCreat(selectvalue);   
    });

my question is how to write the function myTreeCreat( selectvalue),
assumed I use getRootNode(selectvalue) get the tree root node.
like this:
myRootNode=gerRootNode(selectvalue);
thus I have pass the parameter "selectvalue" to get the tree root node.
but I want to know how to pass a " defferent root" to the treepanel and reload it.
I have searched all forums,and get nothing on this.

any one help me?

[woog]

anyone can help me?

[franciscallo]

I do not think I have a clear understanding about your all your problem but I will try to help you on the tree problem.

If you want to load a different set of tree nodes, first you can get the root node using the TreePanel.getRootNode() and replace its child with different set of nodes by calling TreeNode.removeChild() and TreeNode.appendChild() or you can just create a new TreePanel altogether.

[rossbates]

I think I follow you here as I am having the same problem figuring this out.

Using the code from the ext tree example:

    var Tree = Ext.tree;
    
    var tree = new Tree.TreePanel({
        el:'tree-div',
        x:50,
        ddGroup : 'center',
        useArrows:true,
        collapsible: true,
        shadow: true,
        autoScroll:true,
        animate:true,
        enableDD:true,
        containerScroll: true, 
        loader: new Tree.TreeLoader({
            dataUrl:'get-nodes.php'
        })
    });

    // set the root node
    var root = new Tree.AsyncTreeNode({
        text: 'music',
        draggable:false,
        id:'music'
    });
    tree.setRootNode(root);
    
    // render the tree
    tree.render();
    root.expand();

This works great, I get a tree with everything in the "music" directory.

Now as a simple example, I want a button that switches to another directory under my root called "movies". I've tried many different ways but I can't get a handle on the original tree object to change the root node and reload it.

var buttonHandler = function(button,event) {
  
     var newRoot = new Tree.AsyncTreeNode({
        text: 'movies',
        draggable:false,
        id:'movies'
    });
    tree.setRootNode(newRoot);
    
    tree.render(); //doesn't work
    tree.getRootNode().reload(); //doesn't work
    tree.getLoader().load(newRoot); //doesn't work


  
 };

I'm sure there is a simple answer, but I'm stuck.

Thanks in advance for any assistance.

-Ross

edit: Not trying to hijack the thread with my example. I just think woog and I are both missing the same thing conceptually about how the TreePanel can be reset/updated so I wanted to add some more context to the question.

[woog]

thanks franciscallo! I have tried your method. it does't work.
anything else I have tried some method like this:

  
     ui.remove(); //does't work.
     unregisterNode(currentRoot); //does't work.
     removeChild(); //does't work.

I 'm sure that I have got the correct different RootNodes of the tree.
and it display correct at the first time of this tree load.
I use the AsyncTreeNode() to get the different treeRootNodes by different urls.

but the parameter pass to AsyncTreeNode() at the second time ,it point me:

AsyncTreeNode()(undefined),
or "A is undefined[Break on this error] Ext.tree.TreeEventModel=function(A){this...enable:function(){this.disabled=false}};"
or"R is undefined[Break on this error] Ext.DomHelper=function(){var L=null;var ... N=A(O);return new Ext.Template(N)}}}();"

it seems Ext has no driver to process this problem.
the rootnode of treepanel is unvariable.
any one can give me a help?

[franciscallo]

I think usability wise, it is not good to change the content of the tree but since I do not know how your whole app work, I will leave that up to you.

Woog: If you could post your code that would me help you a lot better.

Rossbates: Why dont you just show in the tree your music and movies folder and let them expand which folder they like?

If you still would like to change the content of your whole tree, you can just get the loader, point that dataUrl to somewhere else and/or update the base params, and reload the tree.

http://extjs.com/deploy/dev/docs/?cl...ree.TreeLoader

[rossbates]

I think usability wise, it is not good to change the content of the tree but since I do not know how your whole app work, I will leave that up to you.

The reason I would want the tree root to change is if the user wanted to quickly navigate a non-contiguous section of the filesystem. For example the "file open" dialog in XP, or the favorites panel in KDE's Dolphin. The left hand panel allows you to jump from Desktop, to home, to music, etc..... the right hand panel is always relative. When navigating you think of the right panel as "everything below what I just selected on the left".

That being said, I really don't want to change the URL of the TreeLoader I just want to pass a different id for the root of my AsyncTreeNode so the php handler knows where to "move" across the filesystem.

When I try it this way:

var root2 = new Tree.AsyncTreeNode({text: 'home', id:'home'});
tree.setRootNode(root2);
tree.root.reload();

the tree.setRootNode() function works but I get a 'c has no properties error' on the tree.root.reload().

Note that this is an event after the initial tree has been fully setup and rendered sucessfully.

All I really want to do is change the id of the AsyncTreeNode before reload and I'm missing a method or syntax for making it happen.

Thanks for the help!

[rossbates]

Well from reading the forums for a while I know these threads will often end with "that was easy".

tree.root.setText('foo');
tree.root.id = 'foo';
tree.root.reload();

I sure wandered off into the weeds on this one. Doh!

[franciscallo]

I am not sure if changing the id is the better way but I think you are better off of just changing the baseParams and reload the node just like I said on my previous post. Its much cleaner that way and that is what baseParams is for.

[rossbates]

Hi franciscallo - I follow your logic now. Just leave root untouched then make the changes you need to "move across" the filesystem using a combo of:

TreeNode.removeChild()
TreeNode.appendChild()

The reason I was going the other route is that I am using an AsyncTreeNode class and the nodes are built dynamically behind the scenes with php/json. Instead of iteratively removing children then appending them based on an event it was just a matter of changing the root path and reloading.

If that is a bad practice I'll use the other method.

This is clicking now, thanks for your patience.