So löschen Sie einen Knoten aus einem Ext -Treepanel, wenn der Knoten nicht gerendert wurde

Question

Ich habe festgestellt, dass ich keine Knoten löschen kann, die noch nicht gerendert wurden. Der folgende Code zeigt, was ich meine. Ich habe es aus der Kommandozeile des Chroms (und Firebugs) ausgeführt, während ich auf http://dev.sencha.com/deploy/dev/exa...dow/hello.html (Da diese Seite ausgiebig vorgeladen ist)

Ich tippte jede Aussage separat ein, um sicherzustellen, dass es keine Probleme mit asynchronen Operationen gab (obwohl die Baumdaten im Speicher sind)

Ext.getBody.update('');
// Tree with preloaded nodes in memory 
var tree = new Ext.tree.TreePanel({ 
   renderTo: Ext.getBody(),  
   width: 300,  
   height: 500,  
   rootVisible: false, 
   loader: new Ext.tree.TreeLoader({preloadChildren:true}), 
   root: new Ext.tree.AsyncTreeNode({ 
     expandend: true, 
     children: [ 
        {text: 'Folder 1', id: 'folder1', leaf: false, children: [ 
            {text: 'File 1', id: 'file1', leaf: true}, 
            {text: 'File 2', id: 'file2', leaf: true} 
        ]} 
     ] 
   }) 
}); 

// Try to delete 'File 1', notice that the folder has never been expanded 
tree.getRootNode().childNodes[0].childNodes[0].remove(true); 

// Expand the node and see that 'File 1' is still there 
tree.getRootNode().childNodes[0].expand(); 

// Delete the first child 1 again, it works now that it's been rendered 
tree.getRootNode().childNodes[0].childNodes[0].remove(true);

Irgendwelche Vorschläge, was zu tun ist?

ANTWORTEN

var nodeToRemove = tree.getRootNode().childNodes[0].childNodes[0];
if (!nodeToRemove.rendered) {
    var children = node.parentNode.attributes.children;
    Ext.each(children, function(child, index){
        if (child.id == nodeToRemove.id) {
            chilren.splice(index, 1);
            return false;
        }
    }) ;
} else {
    nodeToRemove.remove(true);
}

Answer 1

Ich habe es endlich herausgefunden, tatsächlich Condor aus der Ext-Js-Unterstützung hat es für mich herausgefunden.

Das Problem war, dass ein Treeloader standardmäßig seine Kinder löscht, wenn die Treeloader#Reload aufgerufen wird (es wird von AsyncTeenode#expt () aufgerufen, wenn die Clearonload -Option wahr ist (Standard).

 (TreeLoader) load : function(node, callback, scope){
        if(this.clearOnLoad){
            while(node.firstChild){
                node.removeChild(node.firstChild);
            }
        }
        if(this.doPreload(node)){ // preloaded json children
            this.runCallback(callback, scope || node, [node]);
        }

Also erstellen Sie meinen Baumlader mit clearOnLoad: false Behebt mein Problem. Außer wenn ich alle untergeordneten Knoten entferne. Um das zu beheben, brauchte ich den folgenden Patch:

Ext.tree.TreeLoader.prototype.doPreload = 
Ext.tree.TreeLoader.prototype.doPreload.createSequence(
  function(node){
    if (node.attributes.children)  {
      node.attributes.children = [];    
    }
  }
);

Hier ist ein Link zum Ext-JS-Thread:

http://www.sencha.com/forum/showthread.php?122681-deleting-nrendered-nodes-from-a- tree-doesn-t-work&p=567459#post567459

@Pumbaa: Dies ist eher eine Lösung als eine Problemumgehung, wie Sie vorgeschlagen haben, aber ich bin wirklich dankbar für Ihre Hilfe.

Answer 2

Ext.tree.treepanel ist die einzige Komponente, die ich am meisten hasse (gefolgt von Formalel).

Folgendes passiert: Der Treeloader lädt die untergeordneten Knoten des Root Knode aus seinem ursprünglichen Konfigurationsobjekt vor, und auch ein Aufruf an Asynctreenode.expand, was den Baum im Grunde zurücksetzen wird.

Sie müssen also den Knoten aus der Konfiguration Ihres RootNode -Konfiguration entfernen, bevor Sie erweitern:

tree.getRootNode().attributes.children[0].children.shift();

---

Bearbeiten: Eigentlich ist das intuitiver:

tree.getRootNode().childNodes[0].attributes.children.shift();

(tut das Gleiche, da seitdem root.childNodes[0].attributes === root.attributes.children[0])

Answer 3

Bis der Treenode erweitert ist, werden die Elemente noch nicht als ExtJS -Komponenten initialisiert. Bis zu diesem Zeitpunkt sitzen sie nur in der Reihe von untergeordneten Elementen (Xtyped Standard JavaScript -Objekte). Versuchen Sie, sie aus diesem Array zu entfernen und dann den Gegenstand zu erweitern. Das sollte den Trick machen

Prost, Rob