jquery - example - ¿Por qué jsTree open_all() no funciona para mí?
jstree options (4)
Comencé a jugar con jQuery y el complemento jsTree ayer, y lo hizo cargar correctamente el árbol con una llamada AJAX a un servlet. Ahora, me gustaría que el árbol abra todos los nodos después de cargar, así que agregué una función de éxito al atributo ajax. Sin embargo, parece que no consigo que el método open_all () funcione correctamente. Soy muy nuevo en trabajar con jQuery, así que supongo que es algo simple que estoy haciendo mal.
Firebug no muestra ningún error que descarte el error tonto del nombre del método mal escrito. Revisé la documentación y creo que estoy haciendo todo correctamente de acuerdo con lo que leo. El árbol se está cargando correctamente, pero no abre todos los nodos después de cargar la página.
Estoy usando jQuery 1.4.2 y jsTree 1.0rc2 en Firefox 3.6.8.
Aquí está el código que estoy usando para cargar el árbol e intentar abrir todos los nodos en el árbol:
// Create the tree object
$("td#modelXML").jstree({
core : { "animation" : 0 },
//xml_data : {"data" : "" + xml, "xsl" : "nest"},
xml_data : {"ajax" :
{"url" : "servlet/GetModelHierarchy",
"type" : "post", "data" : { modelId : "" + modelId} },
"xsl" : "nest",
"success" : function(){
$(this).open_all(-1);
}
},
themes : {"theme" : "classic", "dots" : true, "icons" : true},
types : {
"types" : {
"category" : {
"valid_children" : ["factor"]
},
"factor" : {
"valid_children" : ["level"]
},
"level" : {
"valid_children" : "none",
"icon" : {
"image" : "${request.contextPath}/jsTree/file.png"
}
}
}
},
plugins : ["themes", "types", "xml_data"]
});
¡Prueba esto!
$("td#modelXML").jstree("open_all","#nodeID");
No pude hacer que funcionara con tree.jstree(''open_all'')
o data.inst.open_all(-1)
- al final tuve que usar data.instance.open_all()
- note el cambio de inst a instancia, y open_all (-1) a simplemente open_all (), ambos parecen ser necesarios con jQuery 1.11 y jstree 3.0.0. Mi bloque de código final se ve así:
$(document).ready(function() {
var tree = $(''#jstree'');
tree.bind(''loaded.jstree'', function(event, data) {
data.instance.open_all();
});
tree.jstree({});
});
Tienes que engancharte a los eventos, y luego llamar a open_all
.
Para tener todos los nodos abiertos en la carga, use:
var tree = $("#id-or-selector-for-my-tree-element");
tree.bind("loaded.jstree", function (event, data) {
tree.jstree("open_all");
});
Haga lo anterior, antes de inicializar el árbol con .jstree({...})
.
Si lo actualiza, para que todos los nodos se abran de nuevo, debe usar:
tree.bind("refresh.jstree", function (event, data) {
tree.jstree("open_all");
});
Sí, esta es una pregunta antigua, pero sin una respuesta aceptada y teniendo la única respuesta que no me es útil, aquí está mi respuesta, que ahora uso:
var tree = $("td#modelXML")
.bind("loaded.jstree", function (e, data) {
data.inst.open_all(-1); // -1 opens all nodes in the container
})
.jstree({ /* your jsTree options as normal */ });
El punto clave aquí es que data.inst
es su jsTree
, y es la única referencia que tendrá disponible porque el tree
no tendrá un valor hasta que .jstree({
finalice. Desde que se llama .jstree({
dentro de .jstree({
call , el resultado aún no existirá. ¿Ves?