Problem in removing a node from tree:deletin alternate node

[varsha.kothari]

Hi,
I am facing a problem while deleting node from a tree.
I have a tree which has suppose 5 childs:
-Root
+C1
+C2
-C3
+CC1
+C4

Now my requirement is that when I click on CC1 then C1, C2, C4 should be remomved from "Root".
I tried using this code in tree.onClick :

Ext.each(delnode.childNodes, function(item)
{
alert("item:"+item.text+"id"+item.id);
if(item != my.id){
delnode.removeChild(item);
}

});

Now the problem is : Its deleting alternate nodes i.e. it will delete C1 then leave C2, then delete C4. I tried it several times but its not picking every node.

Please suggest something quickly...........
Thanks in advance

[evant]

Your code looks a little strange, I would think something like this:

myTree.on('click', function(node)
{
   var parent = node.parentNode;
   if (parent) //make sure we didn't click the root
   {
      Ext.each(parent.childNodes, function(child)
      {
         if (node !== child)
            parent.removeChild(child);
      }
      );
   }
}
);

[varsha.kothari]

Hi, My code is similar to what you posted, delnode is "parent" for my code. I have got delnode by some calculations because there are multiple levels of tree.

But the main problem is that it deletes only alternate nodes. i.e. it skips the node that is just next in tree to that deleted node. Eg.

+A
+B
+C

Here A will be deleted and C will be deleted but B is skipped and is still there.
Is this the behaviour of removeChild method().
I tried using remove() in same fashion but its also deleting alternate nodes in tree.

[evant]

Oh, duh. By removing nodes you're invalidating the iterator.

var toRemove = [];
Ext.each(parent.childNodes, function(child)
{
   if (node !== child)
      toRemove.push(child);
}
);

Ext.each(toRemove, function(item)
{
   parent.removeChild(item);
}
);

[varsha.kothari]

Hi, My code is similar to what you posted, delnode is "parent" for my code. I have got delnode by some calculations because there are multiple levels in tree.

But the main problem is that it deletes only alternate nodes. i.e. it skips the node that is just next in tree to that deleted node. Eg.

+A
+B
+C

Here A will be deleted and C will be deleted but B is skipped and is still there.
Is this the behaviour of removeChild method().
I tried using remove() in same fashion but its also deleting alternate nodes in tree.
Can you tell me the exact behaviour, what is happening?
Thanks....

[ndtreviv]

Here is the error:

nodes[i] has no properties
(no name)(Object tId=4 status=200 statusText=OK)ext-all-debug.js (line 3570)
apply(function(), undefined, [Object tId=4 status=200 statusText=OK, Object url=./path/to/updater.jsp method=post], undefined)ext-base.js (line 9)
handleResponse(Object tId=4 status=200 statusText=OK)ext-all-debug.js (line 5317)
getViewWidth(Object conn=XMLHttpRequest tId=4, Object scope=Object argument=Object timeout=30000, undefined)ext-base.js (line 10)
getViewWidth()ext-base.js (line 10)
[Break on this error] v = this.getStyle(styles[sides.charAt(i)]);

In this case, nodes was an array of TreeNode objects. I was iterating through them using a standard for loop, rather than the each() iterator, and attempting either nodes[i].remove() or nodes[i].parentNode.removeChild(nodes[i]).

I believe the problem has something to do with the re-draw triggered by the "unselect" event fired by the MultiSelectionModel when the removeChild function is called on the TreeNode object. I don't have much evidence to back this up - it's just a hunch at the moment.

It might be worth mentioning that instead of a pure TreePanel, I'm using the ColumnTree extended from TreePanel, and used in Ext-js examples.

If I can submit anything further that may help, please let me know!

[oburlaca]

I've just encountered the same problem.
I was trying to do one of the following:

nodes = treePanel.getSelectionModel().getSelectedNodes();
Ext.each(nodes, function(n) {n.remove()}, this);

As evant mentioned earlier, "By removing nodes you're invalidating the iterator."

second try:

nodes = treePanel.getSelectionModel().getSelectedNodes();
for (var i=0; i<nodes.length; i++) { 
var n = nodes[i];
n.remove();
}

this also doesn't work because nodes.length is evaluated each time, and is decreasing with each iteration.

So I've jus tried to go from the end to the beggining of the array.
This code works for me:

for (var i=nodes.length-1; i>=0; i--) {
var n = nodes[i];
n.remove();
}