title: jquery fancytree load and check all child nodes on check
body: <p>I'm using the fancytree plugin to create a treeview. All of my data is loaded on the expand via ajax and json. I also have code in to load child nodes if a user checks a parent node as they aren't technically loaded if that node isn't expanded first.</p>
  
  <p>My problem is, if you have a parent child relationship 3 levels deep, and expand to level 2, the third level doesn't get checked.</p>
  
  <p>In essence I have something like this</p>
  
  <pre><code>Parent1
  --&gt;Child1
  ----&gt;Child1-1
  ----&gt;Child1-2
  ----&gt;Child1-3
  --&gt;Child2
  </code></pre>
  
  <p>Now, if you never expand parent and check it, the nodes all get loaded and checked. However, if you expand parent 1 to show child 1 and 2, then check parent1 the child nodes 1-1 through 3 never get loaded or checked. Here is the code I have to load the child nodes on check, what am I missing.</p>
  
  <pre><code>select: function (event, data) { //here's where I need to load the children for that node, if it has them, so they can be set to checked
  
  
      var node = data.node;
                          //alert(node.key);
                          if (node.isSelected()) {
                              if (node.isUndefined()) {
  
                                  // Load and select all child nodes
                                  node.load().done(function () {
                                      node.visit(function (childNode) {
  
                                          childNode.setSelected(true);
                                      });
                                  });
                              } else {
                                  // Select all child nodes
                                  node.visit(function (childNode) {
  
                                      childNode.setSelected(true);
                                  });
                              }
                              // Get a list of all selected nodes, and convert to a key array:
                              var selKeys = $.map(data.tree.getSelectedNodes(), function (node) {
  
                                  treeHash[node.data.treeItemType + node.key] = node.key;
                              });
  
                          }
  </code></pre>
  
  <p>Here is my full JS just for reference</p>
  
  <pre><code>if ($("entityTree") != null) {
              $(function () {
                  // Create the tree inside the &lt;div id="tree"&gt; element.
                  $("#entityTree").fancytree({
                      source: { url: "/Home/GetTreeViewData", cache: true }
                      , checkbox: true
                      , icons: false
                      , cache: true
                      , lazyLoad: function (event, data) {
                          var node = data.node;
                          data.result = {
                              url: "/Home/GetTreeViewData/" + node.key.replace(node.data.idPrefix, "")
                              , data: { mode: "children", parent: node.key }
                              , cache: true
                          };
                      }
                      , renderNode: function (event, data) {
                          // Optionally tweak data.node.span
                          var node = data.node;
  
                          var $span = $(node.span);
                          if (node.key != "_statusNode") {
  
                              $span.find("&gt; span.fancytree-expander").css({
                                  borderLeft: node.data.customLeftBorder
                                  //borderLeft: "1px solid orange"
                              });
                          }
                      }
                      , selectMode: 3
                      , select: function (event, data) { //here's where I need to load the children for that node, if it has them, so they can be set to checked
                          var node = data.node;
                          //alert(node.key);
                          if (node.isSelected()) {
                              if (node.isUndefined()) {
  
                                  // Load and select all child nodes
                                  node.load().done(function () {
                                      node.visit(function (childNode) {
  
                                          childNode.setSelected(true);
                                      });
                                  });
                              } else {
                                  // Select all child nodes
                                  node.visit(function (childNode) {
  
                                      childNode.setSelected(true);
                                  });
                              }
                              // Get a list of all selected nodes, and convert to a key array:
                              var selKeys = $.map(data.tree.getSelectedNodes(), function (node) {
  
                                  treeHash[node.data.treeItemType + node.key] = node.key;
                              });
  
                          }
                          else {
                              delete treeHash[node.data.treeItemType + node.key];
                              //alert("remove " + node.key);
                          }
                          for (var i in treeHash) {
                              alert(treeHash[i]);
                          }
  
                      }
                      , strings: {
                          loading: "Grabbing places and events…",
                          loadError: "Load error!"
                      },
                  })
              });
          }
  </code></pre>