Я получаю имя дочернего дерева, но хочу получить полную иерархию имен родительских узлов.
Ниже код показывает, как я получаю дочерний узел и печатаю его значение в определенном элементе div:
$(document).ready(function () {
$('#bdeViewNew').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]).text.trim());
$('#treeBreadCrumbs').html(r.join(', '));
}
});
});
Теперь он печатает значение дочернего узла, например. Child a
. Но я хочу что-то вроде следующего, если древовидная структура показана ниже:
Parent
Child 1
Child a
Child b
Child 2
Child c
Child d
поэтому, если я нажму на Child a
, я хочу, чтобы мой контент div обновился как
Parent > Child 1 > Child a
на данный момент я получаю только Child a
. Пожалуйста, дайте мне знать, как я могу получить правильный вывод.
Я пробовал так, как показано ниже, чтобы получить путь ко всем родительским узлам:
$(document).ready(function() {
$('#bdeViewNew').on('changed.jstree', function(e, data) {
var ids = data.inst.get_path('#bdeViewNew' + data.rslt.obj.attr('id'),true);
var names = data.inst.get_path('#bdeViewNew' + data.rslt.obj.attr('id'),false);
alert("Path [ID or Name] from root node to selected node = ID's = "+ids+" :: Name's = "+names);
});
});
но до сих пор нет результата для get_path. Нужно ли использовать другой JS или плагин? И в чем смысл attr('id') я должен передать идентификатор этого li или что-то еще, так как я не понял этот синтаксис должным образом.
Добавление моего jstree:
<div id="bdeViewNew">
<ul>
<li id="bde" data-jstree='{"opened":true,"icon":"./images/tree.png"}'">
Parent 1
<ul>
<li id="aaa" data-jstree='{"opened":true,"icon":"./images/tree.png"}'>
Child 1 <c:forEach items="${empInfo.empList}"
var="empValue">
<ul>
<li id="bbb" data-jstree='{"icon":"./images/tree.png"}' >${empValue.empName}</li>
</ul>
</c:forEach>
</li>
</ul>
<ul>
<li id="ccc" data-jstree='{"icon":"./images/tree.png"}'>Child 2
<c:forEach items="${imgInfo.imgList}"
var="imgValue">
<ul>
<li id="ddd" data-jstree='{"icon":"./images/tree.png"}'>${imgValue.imgName}</li>
</ul>
</c:forEach>
</li>
</ul>
</li>
</ul>
</div>