title: Extjs - How to insert/update/delete - child nodes - dynamically
body: <p>My question is similar to <a href="http://www.sencha.com/forum/showthread.php?2916-insert-update-delete-child-nodes-dynamically" rel="nofollow">http://www.sencha.com/forum/showthread.php?2916-insert-update-delete-child-nodes-dynamically</a></p>
  
  <p>only difference being that I am using Ext.Tree. I split main page into two portions.
  I kept left portion for displaying data in tree structure and right portion for some displaying some details in the screen.</p>
  
  <p>Currently there are some child nodes are under root node (Source). When one of child clicked, I populate some data in the right portion of screen.</p>
  
  <p>Can anyone explain me to how update (insert/update/delete) child nodes dynamically when i add or delete data on right part of screen which is a grid.</p>
  
  <pre><code>   Ext.onReady(function() {
  
      var Tree = Ext.tree;
  
      var tree = new Tree.TreePanel({
          useArrows: true,
          autoScroll: true,
          animate: true,
          enableDD: true,
          containerScroll: true,
          border: false,
          // auto create TreeLoader
          dataUrl:'[JS Array]',
          root: {
              nodeType: 'async',
              text: 'ALL',
              draggable: false,
              id: ''
          }
      });
  
      // render the tree
      tree.render('tree-div');
      tree.getRootNode().expand();
  }); 
  </code></pre>