如何在jstree中获取选中节点的文本
How to get selected node's text in jstree
我有一个如下所示的 jstree
并在我的脚本中包含代码
$("#jstree").click(function (e) {
var node = $("#jstree").jstree('get_selected');
$('#resultText').html(node);
});
我需要的是,如果我选择书籍、标题、价格,我需要将输出显示为 book-title-price。通过使用上面的代码,我可以获得 ids 即。我选择的节点的 1-1_1-1_2,但是我怎样才能以上述格式获取所选节点的 texts?
jstree 集成的完整代码。
@model List<XMLNodeSearch.Models.NodeSearchModel>
<link href="~/vakata-jstree-8ea6ce7/dist/themes/default/style.min.css" rel="stylesheet" />
<script src="~/Script/jquery-1.12.0.min.js"></script>
<script src="~/vakata-jstree-8ea6ce7/dist/jstree.min.js"></script>
<script src="~/vakata-jstree-8ea6ce7/dist/jstree.js"></script>
<script>
$(function () {
$('#jstree').jstree();
$("#jstree").click(function (e) {
var node = $("#jstree").jstree('get_selected').text();//This line with text() will throw an error
$('#resultText').html(node);
});
</script>
<section>
<label>Result - <span id="resultText"></span></label>
<div id="NodeResult">
@if (Model != null)
{
<div id="jstree">
@foreach (var treeNode in Model)
{
<!-- in this example the tree is populated from inline HTML -->
<ul>
<li id="@treeNode.Id">@treeNode.NodeName
@if(treeNode.ChildNode.Count() > 0)
{
<ul>
@foreach (var childNd in treeNode.ChildNode)
{
<li id="@childNd.Id">@childNd.NodeName</li>
}
</ul>
}
</li>
</ul>
}
</div>
}
</div>
</section>
你可以尝试使用这种方式,如果它适合你。
console.log($("#divtree").jstree("get_selected").text());
终于找到了我的问题的解决方案。我在这里发布答案以供任何人将来参考。
我所做的是在我的脚本块中添加以下脚本。
$('#jstree').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);
}
$('#resultText').html('Selected: ' + r.join(', '));
}).jstree();
这给了我想要的输出。
回答有点晚了,但无论如何都会post。
这样只会得到id。
$('#tree_container').jstree('get_selected')
这应该得到文本。
$('#tree_container').jstree('get_selected', true)[0].text;
我有一个如下所示的 jstree
并在我的脚本中包含代码
$("#jstree").click(function (e) {
var node = $("#jstree").jstree('get_selected');
$('#resultText').html(node);
});
我需要的是,如果我选择书籍、标题、价格,我需要将输出显示为 book-title-price。通过使用上面的代码,我可以获得 ids 即。我选择的节点的 1-1_1-1_2,但是我怎样才能以上述格式获取所选节点的 texts?
jstree 集成的完整代码。
@model List<XMLNodeSearch.Models.NodeSearchModel>
<link href="~/vakata-jstree-8ea6ce7/dist/themes/default/style.min.css" rel="stylesheet" />
<script src="~/Script/jquery-1.12.0.min.js"></script>
<script src="~/vakata-jstree-8ea6ce7/dist/jstree.min.js"></script>
<script src="~/vakata-jstree-8ea6ce7/dist/jstree.js"></script>
<script>
$(function () {
$('#jstree').jstree();
$("#jstree").click(function (e) {
var node = $("#jstree").jstree('get_selected').text();//This line with text() will throw an error
$('#resultText').html(node);
});
</script>
<section>
<label>Result - <span id="resultText"></span></label>
<div id="NodeResult">
@if (Model != null)
{
<div id="jstree">
@foreach (var treeNode in Model)
{
<!-- in this example the tree is populated from inline HTML -->
<ul>
<li id="@treeNode.Id">@treeNode.NodeName
@if(treeNode.ChildNode.Count() > 0)
{
<ul>
@foreach (var childNd in treeNode.ChildNode)
{
<li id="@childNd.Id">@childNd.NodeName</li>
}
</ul>
}
</li>
</ul>
}
</div>
}
</div>
</section>
你可以尝试使用这种方式,如果它适合你。
console.log($("#divtree").jstree("get_selected").text());
终于找到了我的问题的解决方案。我在这里发布答案以供任何人将来参考。
我所做的是在我的脚本块中添加以下脚本。
$('#jstree').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);
}
$('#resultText').html('Selected: ' + r.join(', '));
}).jstree();
这给了我想要的输出。
回答有点晚了,但无论如何都会post。
这样只会得到id。
$('#tree_container').jstree('get_selected')
这应该得到文本。
$('#tree_container').jstree('get_selected', true)[0].text;