¿Cómo abro todos los nodos en jquery Jstree?

Question

estoy usando el siguiente código:

$("#treeview").jstree(); 
$("#treeview").jstree('open_all'); 

Con el código HTML siguiente:

<div id="treeview"> 
    <ul> 
    <li> 
     <a href="#">rubentebogt</a> 
     <ul> 
     <li> 
      <a href="#" onclick="goTo('index.php?module=alarm&amp;pagina=dashboard&amp;id=6',false);">Beneden</a> 
     </li> 
     <li> 
      <a href="#" onclick="goTo('index.php?module=alarm&amp;pagina=dashboard&amp;id=7',false);">Boven</a> 
     </li> 
     </ul> 
    </li> 
    </ul> 
</div> 

Mi problema es que todos los nodos permanecen cerrados, no puedo conseguir que se abran con jstree (' Abrir todo');

Answer 1

El jsTree documentation es "subóptimo". Los documentos no indican claramente que la inicialización funciona de forma asíncrona. Hay core.loaded():

Una función ficticia, cuyo propósito es solo activar el evento cargado. Este evento se desencadena una vez que se cargan los nodos raíz del árbol, pero antes de que se abran los nodos establecidos en inicialmente_abierta.

Esto sugiere que se desencadena un evento loaded.jstree después de configurar el árbol. Puede enlazar en ese evento para abrir todos sus nodos:

var $treeview = $("#treeview"); 
$treeview 
    .jstree(options) 
    .on('loaded.jstree', function() { 
    $treeview.jstree('open_all'); 
    }); 

Answer 2

Si quieren abrir todos los nodos cuando el árbol cargado:

$("#treeview") 
    // call `.jstree` with the options object 
    .jstree({ 
     "plugins" : ["themes", "html_data","ui","crrm","sort"] 
    }) 
    .bind("loaded.jstree", function (event, data) { 
     // you get two params - event & data - check the core docs for a detailed description 
     $(this).jstree("open_all"); 
    })  
}); 

Answer 3

.bind("loaded.jstree", function (event, data) { 
     // you get two params - event & data - check the core docs for a detailed description 
     $(this).jstree("open_all"); 
    }) 

Answer 4

todas las respuestas anteriores no funciona en mi espacio de trabajo. Busqué de nuevo y parece que este enlace (Why doesn't jsTree open_all() work for me?) es muy útil, y publicar mi respuesta: Versión

jstree: 3.0.0-bata10

$(document).ready(function() { 
    $("#tree").bind("loaded.jstree", function(event, data) { 
    data.instance.open_all(); 
    }); 
    $("#tree").jstree(); 
}) 

Answer 5

estoy usando la versión 3 de jstree y Chrome. El evento cargado no funcionó para mí, pero el evento ready hizo, incluso después de crear la instancia jstree:

$('#treeview').on('ready.jstree', function() { 
    $("#treeview").jstree("open_all");   
}); 

http://www.jstree.com/api/#/?q=.jstree%20Event&f=ready.jstree

Answer 6

uso simple código

$(".jstree").jstree().on('loaded.jstree', function() { 
    $(".jstree").jstree('open_all'); 
}) 

Answer 7

Al utilizar datos html ' puede configurar la clase jstree-open en cualquier elemento <li> para hacer que se extienda inicialmente, de modo que sus hijos estén visibles. ' - https://www.jstree.com/docs/html/

<li class="jstree-open" id="node_1">My Open Node</li> 

Answer 8

Probé todas las respuestas aquí y que no funcionó con jsTree (v3.3.4). Lo que funcionó es el evento load_node.jstree:

.on('load_node.jstree', function() { 
     jstree.jstree("open_all"); 
    })