title: Use query result to load nodes for jsTree on user request
body: <p>I've been reasearching a lot but I couldn't find the right answer.</p>
  
  <p>I want to know how to generate a jsTree on demand and the nodes have to be loaded from the data contained in a database.
  The data will be returned by a function.</p>
  
  <p>My purpose is when the user clicks on a node the script generate only the sons of that node based on the database query.</p>
  
  <p>To do that I tried many scripts that I found here and the most similar with what I want to do is that one:</p>
  
  <p>$("#tree-cat1").jstree({</p>
  
  <pre><code>"plugins": ["themes", "json_data", "ui"],
  "themes": {"theme": "classic","dots": true,"icons": true},
  "json_data": {
        //root elements
      "data": [{"data":'A node',"state":'closed',"attr":{"id":'A'}}], 
      "ajax": {
          "type": 'POST',
          "data": {"action": 'getChildren'},
          "url": function (node) { 
              var nodeId = node.attr('id'); //id="A"
  
              return 'yuorPathTo/GetChildrenScript/' + nodeId;
          },
          "success": function (new_data) {
              //where new_data = node children 
              //e.g.: [{'data':'A1 node','attr':{'id':'A1'}}, {'data':'A2 node','attr':{'id':'A2'}}]
              return new_data;
          }
      }
  }
  </code></pre>
  
  <p>});</p>
  
  <p>It was written originally from Irishka.</p>
  
  <p>The problem is I couldn't make it work. The main issue is to know what  data is being returned when you make the call "return yuorPathTo/GetChildrenScript/" and if someone can give an example of that data.</p>
  
  <p>Any help will be appreciate.</p>