jstree - agregando nodos secundarios que a su vez contienen hijos

Tengo un código en el que necesito la capacidad de agregar nodos secundarios a un jstree que a su vez contienen hijos. El siguiente código agrega correctamente un nodo 'child2' a 'child1', pero ignora los datos de child3. Cualquier ayuda muy apreciada. Código sigue:jstree - agregando nodos secundarios que a su vez contienen hijos

<html> 
<head> 
<script type="text/javascript" src="http://static.jstree.com/v.1.0rc2/jquery.js"></script> 
<script type="text/javascript" src="http://static.jstree.com/v.1.0rc2/jquery.jstree.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $(function() { 
     $("#tree").jstree({ 
      "json_data" : { 
       "data" : [ 
        { 
         "data" : "parent", 
         "attr" : { "id" : "root.id" }, 
         "children" : [ { "data" : "child1", 
             "attr" : { "id" : "child1.id" }, 
             "children" : [ ] } 
            ] 
        }, 
       ] 
      }, 
      "plugins" : [ "themes", "json_data", "crrm" ] 
     }); 
    }); 
    $("#add").click(function() { 
     $("#tree").jstree("create", $("#child1\\.id"), "inside", 
       { "data" : "child2", "attr" : { "id" : "child2.id" }, 
        "children" : [ { "data" : "child3", "attr" : { "id" : "child3.id" }, "children": [ ] } ] }, 
          function() { alert("added"); }, true); 
    }); 
}); 
</script> 
</head> 

<body> 

<div id="tree" name="tree"></div> 

<input type="button" id="add" value="add" /> 
</body> 
</html>

Fuente

2010-08-16 user419766

Quizás esto no es ¿posible? Presumía que la función de creación se implementó para que se repitiera sobre los niños, pero tal vez no ... Voy a echar un vistazo a la fuente ... – user419766

tuve el mismo problema, ¿cómo lo solucionaron? –

Por lo que puedo ver desde la fuente, "crear" la función no admite la creación de árboles de varios niveles a la vez. El método que se llama no utiliza y verifica el atributo children en datos pasados.

Fuente

2011-09-12 09:46:20 WTK

que tiene que hacer usted mismo, algo así:

   var recursivelyCreate = function (node, parentNodeId) { 
        tree.jstree("create", $("#"+parentNodeId), "inside", node, function() {}, true); 
        if(node.children){ 
         $.each(node.children, function(i, child){ 
          recursivelyCreate(child, node.attr.id); 
         }); 
        } 
       }; 
       recursivelyCreate(rootNodeYouWantToInsert,nodeParentId);

Fuente

2013-07-11 12:46:14 Quentin

En primer lugar, eso no es válido JSON con la última coma dentro del último soporte. Quitar eso:

[ 
    { 
     "data" : "parent", 
     "attr" : { 
      "id" : "root.id" 
     }, 
     "children" : [ 
      { 
       "data" : "child1", 
       "attr" : { 
        "id" : "child1.id" 
       }, 
       "children" : [ ] 
      } 
     ] 
    } 
]

Además, a partir de la versión 3.0 o tal vez antes de poder simplemente basta con insertar un nuevo nodo con JSON. La recursividad ya no es necesaria.

Creé json como tal, lo que crea una carpeta llamada ingresos y coloca muchos elementos de texto debajo de ella, pero también podrían ser carpetas como las de los padres con más contenido. Véase mi función por debajo del cual se inserta esta carpeta dentro de la matriz con todos sus hijos:

{ 
    "text" : "Income", 
     "id" : "_folder_income", 
     "state" : { 
      "opened" : true 
     }, 
     "children" : [ 
     { 
      "text" : "$125,000 - $150,000", 
      "state" : { 
       "selected" : true 
      }, 
      "icon" : "jstree-file", 
      "id" : "6017897162332" 
     }, 
     { 
      "text" : "$150,000 - $250,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6017897374132" 
     }, 
     { 
      "text" : "$250,000 - $350,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6017897397132" 
     }, 
     { 
      "text" : "$350,000 - $500,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6017897416732" 
     }, 
     { 
      "text" : "Over $500,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6017897439932" 
     }, 
     { 
      "text" : "$30,000 - $40,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6018510070532" 
     }, 
     { 
      "text" : "$100,000 - $125,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6018510083132" 
     }, 
     { 
      "text" : "$40,000 - $50,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6018510087532" 
     }, 
     { 
      "text" : "$75,000 - $100,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6018510100332" 
     }, 
     { 
      "text" : "$50,000 - $75,000", 
      "state" : { 
       "selected" : false 
      }, 
      "icon" : "jstree-file", 
      "id" : "6018510122932" 
     } 
    ] 
}

Este mismo JSON también podría ser utilizado para llenar una carpeta principal en la instancia de árbol:

/** 
* inserts a new node (json object returned from url) into an existing node (parentNodeId), for the div ud in jsTreeName which is 
* an instanced jstree. 
* @param string jsTreeName {name of an instanced tree} 
* @param string url {returns json} 
* @param string parentNodeId {string of the parent node id} 
*/ 
function insertUrlIntoNode(jsTreeName, url, parentNodeId) { 
    var nodeTree = getSynchronousJson(url); 
    var tree = $('#'+jsTreeName).jstree(true); 
    tree.deselect_all(); 
    var sel = tree.create_node(parentNodeId, nodeTree); 
    //tree.deselect_all(); 
    //tree.select_node(sel); //optionally you could select the new node after insersion 
}

Fuente

2015-02-26 04:12:10

jstree - agregando nodos secundarios que a su vez contienen hijos

Respuesta

Cuestiones relacionadas