javascript - example - jstree select node

evento jsTree onSelect

Question

He estado tratando de obtener el texto de un nodo que se selecciona en un jsTree. Puedo rellenar el árbol y desencadenar el evento onSelect, pero no puedo encontrar en qué nodo se hizo clic. He visto ejemplos en la red que usan data.rslt.obj.attr("data") para obtener el texto, sin embargo, esto está volviendo indefinido para mí. Además, cuando intento obtener el nodo seleccionado utilizando .jstree(''get_selected'') no puedo encontrar el texto del nodo en ningún lugar del objeto. ¿Cómo puedo obtener el texto del nodo?

Aquí está mi función de devolución de llamada onSelect:

function onSelect(event, data)
{
    // Get the name of the equipment that was selected.
    var selected_node = $("#equipment_tree").jstree(''get_selected'');
    var equipment_name = data.rslt.obj.attr("data");
}

Answer 1

Actualización en 2018.

Gracias al comentario de @ ProfK, la API ha cambiado en la nueva versión de jstree. En jstree v3.1.0 (o anterior), la API ha cambiado a:

$("#treeContainer").bind(
        "select_node.jstree", function(evt, data){
            //selected node object: data.node;
        }
);

Para jstree versión anterior (antes de 2013).

Puede obtener el objeto de nodo seleccionado y su texto por:

$("#treeContainer").bind(
        "select_node.jstree", function(evt, data){
            //selected node object: data.inst.get_json()[0];
            //selected node text: data.inst.get_json()[0].data
        }
);

Answer 2

Con la versión actual, es mejor usar get_selected con full: true , lo que significa que el método devolverá el (los) objeto (s) completo (s) y no solo el id.

Así por ejemplo:

$("#treeNode").jstree(''get_selected'', true);

o:

$("#treeNode").jstree().get_selected(true);

Cada elemento de la matriz tendrá todas las propiedades como texto o id.

Answer 3

El evento click no pasa ningún dato con él, por lo que será necesario utilizar el objeto del evento.

.bind("click.jstree", function (event) {
    alert($(event.currentTarget).parent("li:first").text().trim());
});

Answer 4

La nueva versión de jstree para obtener texto desde el nodo debe usar data.node.text

$("#treeContainer").on("select_node.jstree",
     function(evt, data){
          alert(data.node.text);
     }
);

Answer 5

$("#equipment_tree").bind("select_node.jstree", function(evt, data){

             var i, j, r = [], ids=[];
                for(i = 0, j = data.selected.length; i < j; i++) {
                  r.push(data.instance.get_node(data.selected[i]).text);
                }
                alert(''Selected: '' + r.join('', ''));
           }
);

Tienes que intentarlo.