Come posso aprire tutti i nodi in jQuery Jstree?

Question

Sto utilizzando il seguente codice:

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

Con il seguente codice HTML:

<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> 

mio problema è che tutti i nodi rimanere chiuso, non riesco a loro di aprire con jstree (' open_all ');

Answer 1

Il jsTree documentation è "sub ottimale". I documenti non indicano chiaramente che l'inizializzazione funziona in modo asincrono. C'è core.loaded():

Una funzione fittizia, il cui scopo è solo quello di attivare l'evento caricato. Questo evento viene attivato una volta dopo il caricamento dei nodi radice dell'albero, ma prima che vengano aperti tutti i nodi impostati in initial_open.

Ciò suggerisce che un evento loaded.jstree viene generato dopo la configurazione dell'albero. È possibile collegare in questo caso ad aprire tutti i nodi:

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

Answer 2

Se si desidera aprire tutti i nodi quando albero caricato:

$("#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

tutte le risposte di cui sopra non funziona nel mio lavoro. Ho cercato di nuovo e trovare questo link (Why doesn't jsTree open_all() work for me?) è utile, e posto la mia risposta: versione

jstree: 3.0.0-bata10

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

Answer 5

Sto usando la versione 3 di jstree e Chrome. L'evento caricato non ha funzionato per me, ma l'evento pronto ha fatto, anche dopo che l'istanza jstree è stato creato:

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

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

Answer 6

uso semplice codice

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

Answer 7

Quando si utilizzano dati html ' puoi impostare la classe jstree-open su qualsiasi elemento <li> per renderlo inizialmente esteso, in modo che i suoi figli siano visibili. ' - https://www.jstree.com/docs/html/

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

Answer 8

Ho provato tutte le risposte qui e non ha funzionato con jsTree (v3.3.4). Ciò che ha funzionato è l'evento load_node.jstree:

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