jsTree "create_node" realmente no funciona

Question

Estoy tratando de agregar dinámicamente un nuevo nodo en mi contenedor jsTree. No está funcionando en absoluto. No sé lo que me estoy perdiendo.

jsfiddle example

$("#tree").jstree({ 
    core: { 
     "animation": 0 
    }, 
    "html_data": {}, 
    "themes": { 
     "icons": false 
    }, 
    "search": { 
     "case_insensitive": true, 
     "show_only_matches": true 
    }, 
    "plugins": ["themes", "html_data", "search"] 
}); 

$("#tree").jstree("create_node", $("node_1"), "after", { "data": "Hello World" }); 

html:

<div id="tree"> 
    <ul> 
     <li id="node1"><a>Hello</a></li> 
    </ul> 
</div> 

Answer 1

demostraciónsencilla lo que necesitahttp://jsfiddle.net/gwxTa/2/ohttp://jsfiddle.net/gwxTa/o dinámico - (Haga clic en Añadir botón) http://jsfiddle.net/VBSJ8/ohttp://jsfiddle.net/ak4Ed/

Por favor, ver a mi viejo mensaje: jsTree not working

código de dinámica funcionalidad de botón añadir:

$(function() { 
    $("#tree").jstree({ 
     "json_data": { 
      "data": [ 
       { 
       "data": "Hello", 
       "attr": { 
        "id": "root.id" 
       }, 
       "children": [{ 
        "data": "Hello World", 
        "attr": { 
         "id": "node_1" 
        }, 
        "children": []} 
        ]}, 
       ] 
     }, 
     "plugins": ["themes", "json_data", "crrm"] 
    }); 
}); 


    $("#tree").jstree("create", $("#node_1"), "inside", { 
     "data": "child2" 
    }, function() { 
     alert("added"); 
    }, true); 

La esperanza está incluyendo los guiones:

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> 

    <link rel="stylesheet" type="text/css" href="/css/normalize.css"> 
    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 

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

<script type='text/javascript' src="http://static.jstree.com/v.1.0pre/jquery.hotkeys.js"></script> 

Answer 2

I no sé qué está causando esto, pero agregando un setTimeout cuando creati ng el nodo soluciona el problema

setTimeout(function() { 
    $("#tree").jstree("create_node", $("node_1"), "after", { "data": "Hello World" }); 
}, 1000); 

Answer 3

conjunto 'check_callback': verdadero, de lo contrario todas las operaciones, como crear, renombrar están impedidos. de este modo:

 this.treeDiv.jstree(
       { 

        'core' : { 
         'check_callback': true, 
         'data' : { 
          'url' : function (node) { 
          return 'ajax_roots.json'; 
          }, 
          'data' : function (node) {} 
          } 
        }, 
        "search" : { 
         "fuzzy" : false, 
         "show_only_matches": true, 
         "close_opened_onclear" : true 
        }, 
        "plugins" : ["search", "sort", "json_data"] 
       }); 

Answer 4

Además de establecer core.check_callback de verdad, vale la pena mencionar que la creación de un simple no requiere tantos argumentos. simplemente podría lograrlo haciendo:

$('#tree').jstree(true).select_node('nodeid'); 
var tr = $('#tree').jstree(true), 
      selected = tr.get_selected(); 
selected = tr.create_node(selected, {"type":"file(or any other type you need)"}); 

la esperanza que esto podría ayudar a alguien. Tuve el problema e intenté seguir la API pero no pude hacerlo, en su lugar inspeccioné los códigos de las demos y lo encontré.

Answer 5

añadir un nuevo nodo

$("#categories_jstree").jstree('create_node', '#', {'id' : '1944', 'text' : 'nosde1'}, 'last'); 

donde # es un identificador de nodo padre (empty_now)

añadir un nodo anidado para nodo1

$("#categories_jstree").jstree('create_node', '#1944', {'id' : '1945', 'text' : 'subnode1_1'}); 

el # 1944 - matriz ID del nudo

Answer 6

Me encontré con el mismo problema. El nuevo nodo se almacenaba en mi base de datos, pero NO actualizaba el nombre del nodo ni el texto del nodo. Ejecuté Firebug.php y vi que el ID de nodo recién creado (mysqli_insert_id) no se pasaba a rename_node.

Lo resolví usando variables de sesión - estableciendo una variable para indicar que se accedió a la función de cambio de nombre desde create_node y también estableciendo una variable de sesión 'last_id'.

'CRN' es solo una variable específica de mi base de datos y aplicación, puede ignorarla.

Por lo tanto, utilizando el ejemplo proporcionado response.php, he modificado de la siguiente manera:

case 'create_node': 
      FB::info($_GET, "New Node attributes "); 
      $node = isset($_GET['id']) && $_GET['id'] !== '#' ? (int)$_GET['id'] : 0;    
      $nodeText = isset($_GET['text']) && $_GET['text'] !== '' ? $_GET['text'] : ''; 
      $CRN=$_SESSION['CRN']; 
      $sql ="INSERT INTO CourseLookup (name, text, parent_id, CRN) VALUES('$nodeText','$nodeText','$node','$CRN')"; 
      FB::info($sql, "new node query "); 
      mysqli_query($conn, $sql); 
      $last_id = mysqli_insert_id($conn); 
      $_SESSION['create']=true;//passed to rename_node so it knows to use the $last_id for the node 
      $_SESSION['lastid']=$last_id;//used as the node in rename_node 
      $result = array('id' => $last_id); 
      print_r($result);die; 

      break; 
     case 'rename_node': 
      if($_SESSION['create']){//if a new node was just created 
       $node=$_SESSION['lastid'];//use the last insert id 
      } 
      else{ 
       $node = isset($_GET['id']) && $_GET['id'] !== '#' ? (int)$_GET['id'] : 0;//otherwise use the last menu item clicked 
      } 
      FB::info($_SESSION['create'],"create status");//debugging 
      FB::info($_SESSION['lastid'],"last id");//debuggig 
      //print_R($_GET); 
      $nodeText = isset($_GET['text']) && $_GET['text'] !== '' ? $_GET['text'] : ''; 
      FB::info($nodeText, "node name "); 
      $sql ="UPDATE CourseLookup SET name='$nodeText', text='$nodeText' WHERE id=$node"; 
      FB::info($sql, "rename node query "); 
      mysqli_query($conn, $sql); 
      $_SESSION['create']=false; 
      break;