Wie man Eltern und Eltern Eltern-id in jstree

Ich bin momentan dabei, einen jstree in meinem Programm. Jetzt bin ich in der Lage, die überprüft Knoten-id. Aber wie bekomme ich die id des parent-node-id und auch den übergeordneten parent-node-id.

Wie man Eltern und Eltern Eltern-id in jstree

Unten ist mein javascript, um die Kinder-Knoten-id.

JS:

 $('#tree-container').on('changed.jstree', function (e, data) {
                var i, j, r = [];
                for (i = 0, j = data.selected.length; i < j; i++) {
                    r.push(data.instance.get_node(data.selected[i]).id.trim());
                }
                //alert('Selected: ' + r.join(', '));
                console.log('Selected: ' + r.join(', '));
			

            });

Hier ist mein jsfddle. Bitte werfen Sie einen Blick. http://jsfiddle.net/jjfcnho8/2/ Wenn ich wählen Kind 9, die ich bekommen kann Kind 9 id. Dann, wie bekomme ich Kind 2 und Ordner 1 id.

Jemand wissen, bitte helfen Sie mir. Ich danke Ihnen sehr!

  • Schreiben Sie Ihre demo auf plunker oder etwas anderes... und check die Antwort, könnte es sein, eine doppelte
  • Ich habe die Ansicht, dass die Antwort vor, aber es kann nur mir helfen, das übergeordnete node-id nur. Ich kann nicht das übergeordnete parent-Knoten-id
  • Wie gesagt, bauen Sie Ihre Beispiel-code auf plunker dann können wir helfen, Sie zu erleichtern.
  • Hinzufügen fiddle oder plunker demo
  • Ich bin erstellen...Warten ya
  • jsfiddle.net/jjfcnho8/2 Hier mein jsfiddle. Pls werfen Sie einen Blick
  • Ich kann das Kind 9 id, kann aber nicht die Kind 2 und Ordner 1 id
  • Aber wenn ich wählen Kind 9 und das Kind 10 ist, dann nur ich kann das Kind 2 id
  • Verwenden data.node.parents

InformationsquelleAutor eric | 2016-12-28
  1. 3

    Könnten Sie die parents - Eigenschaft des node-Objekts erhalten Sie von data.instance.get_node(). Als mehrere Knoten könnte haben die gleichen Vorfahren, Sie vielleicht möchten zu vermeiden, sammeln die Duplikate. Für diese können Sie eine Set. Dies ist nur eine Möglichkeit, Sie könnte es tun:

    var nodesOnSelectedPath = [...data.selected.reduce(function (acc, nodeId) {
    var node = data.instance.get_node(nodeId);
    return new Set([...acc, ...node.parents, node.id]);
}, new Set)];

console.log('Selected: ' + nodesOnSelectedPath.join(', '));

    Beachten Sie, dass dies sind der root-Knoten, die id '#'.

    Hier ist die aktualisierte fiddle.

    Ohne root-Knoten

    Um die Liste ohne die #, ist es am einfachsten wenden Sie einen filter auf das Ergebnis:

    console.log('Selected: ' + nodesOnSelectedPath.filter(id => id !== '#').join(', '));

    EcmaScript2015

    Den oben genannten Skripts verwenden der Funktionen von EcmaScript2015 (ES6). Einige Editoren können highlight syntax-Fehler, wenn Sie nicht konfiguriert sind, um zu erkennen, ES6-syntax. Hier finden Sie, wie zu konfigurieren VSCode, Sublime Text, sowie WebStorm für ES6.

    ES5 Alternative

    In ES5 verwenden Sie ein Objekt (acc) zu sammeln, eindeutige id-Referenzen als Namen für die Eigenschaft. Obwohl Object.keys ist wirklich ES6, ist es oft unterstützt, sonst ES5-Browser:

    var nodesOnSelectedPath = Object.keys(data.selected.reduce(function (acc, nodeId) {
    var node = data.instance.get_node(nodeId);
    node.parents.forEach(function (id) {
        acc[id] = 1;
    });
    acc[node.id] = 1;
    return acc;
}, {}));

    Hier ist die entsprechende fiddle.

    Zirkelbezüge in Daten

    Sie schrieb in den Kommentaren, dass Sie versucht, dies zu tun:

    JSON.stringify(data)

    Aber, dass die Daten-Struktur von übergeordneten und untergeordneten Referenzen in es, so ist es möglich, von einem Kind zu seinem übergeordneten Objekt, und von dort wieder zurück auf dem untergeordneten Objekt, ... das ist endlos. Solche Strukturen können nicht konvertiert werden um JSON. Sehen dieses Q&A für Lösungen.

    • Vielen Dank Für Ihre Antwort, und ich habe einige Frage zu stellen. 1) nodesOnSelectedPath = [...Daten.ausgewählt.verringern(Funktion (acc, nodeId) { var Knoten = Daten.Instanz.get_node(nodeId); return new Set([...acc ...Knoten.Eltern-Knoten.id]); }, neuer Satz)]; << Diese Zeile zeigt syntax-Fehler in meiner Codierung. Aber wenn ich laufen, es kann immer noch erfolgreich ausgeführt werden. Warum wird dies geschehen?
    • 2)Konsole.log(JSON.stringify(data, null, 2)); << Diese Zeile machen, mir kam dieser Fehler. Uncaught TypeError: Umwandlung einer kreisförmigen Struktur zu JSON.. Nur wenn ich diese Zeile gelöscht, das Programm nur ausgeführt werden kann
    • 3)Wie kann ich Sie gelöscht, das root-node-id ? Danke
    • Ich bin mit diesem Weg zu entfernen #. var itemtoRemove = "#"; nodesOnSelectedPath.splice($.inArray(itemtoRemove,nodesOnSelectedPath),1);
    • Frage 2 ist wirklich eine andere Frage, und es gibt eine Menge Antworten zu, dass auf SO. Sowieso, ich habe eine Antwort für alle drei follow-up-Fragen in meiner Antwort 😉
    • Danke für die Beantwortung meiner Frage. Wirklich viel Gelernt von der Sache. Trotzdem, nochmals vielen Dank
    • Danke, das ist (fast) für mich arbeiten zu, außer, dass ich ein TypeError: data.selected.reduce(...).delete(...) is not iterable wenn ich die .delete('#') Teil... bitte, jede Hilfe?
    • In der Tat, es funktioniert nicht mit .delete() (das war eine zu schnelle Zugabe habe ich gemacht). Verwenden .filter auf das Ergebnis statt. Siehe update in der Antwort.
    • Sie gerade gemacht mein Tag, vielen Dank! 🙂
    • Sorry, wieder zu kommen auf dieser 🙁 bitte buchen Sie eine non-EC6-version von diesem script?
    • Ich fügte hinzu, ein "ES5 Alternative" auf meine Antwort.

    InformationsquelleAutor trincot
  2. 0

    Verwendung von jQuery, finden Sie das parent-element von dieser Methode

    obj.parent();

    oder

    obj.parent(expr); //expr is a filter express
    • Kann u pls genauer erklären? Ich habe versucht obj auch. es zeigt aber, "cannot read property 'obj' undefined....".
    • Es ist sehr unwahrscheinlich, dass der DOM Elternteil ist der gleiche wie der des übergeordneten Knotens innerhalb des Baumes selbst
    InformationsquelleAutor Cai Yongji
  3. 0

    Dies kann erreicht werden, indem man this.parentNode.parentNode.parentNode.id im onclick-sogar der jstree-Objekt.

    Beispiel:

    $('#myjstree').jstree({<your jstree parameters>}).on('click', '.jstree-anchor', function (e) {
if (this.parentNode.parentNode.parentNode.id == 'id_im_looking_for')
        alert('Yup GOT IT!') 
});

    Getestet mit jstree v3.2 verwenden Sie eine html-Datenquelle. Ein bisschen wackelig? ja. Definitiv test nach upgrades der jstree-Bibliothek, weil, wenn die library-Entwickler ändern Sie diese Struktur der Knoten das Beispiel funktioniert nicht mehr.

    InformationsquelleAutor T3.0
Schreibe einen Kommentar