根据所选的 jsTree 节点筛选 JSON 数据

Question

我在fiddle中有一个例子。我有一棵这样的树：

> Root > Parent[n] > Child[n].

在 Child 中，我添加了一个事件处理程序。在示例中，它位于 Child1 中，因此如果我单击 Child1，它将呈现一个 table，其中包含来自变量 array.

的 3 行

我想要的是，如果我单击 Child1，它将通过分支 "Parent1" 过滤 table (array)，也就是说，它将呈现 table 有 2 行 named "Parent1"。有什么办法吗？

Answer 1

我必须做两件事才能使您的代码正常工作：

添加 jsTree css 使其可扩展
您将 select_node 处理程序附加到 ID 为 $study 的对象，而它应该是 jstree:
```
$('#jstree').on('select_node.jstree', function (evt, data) {...})
```

检查 this Fiddle 上的更新。

如果您愿意，可以稍微简化一下代码 - Fiddle。

更新

如果你想通过所选节点的父文本过滤数组，你可以替换这行：$table.bootstrapTable('load', array);

与：

var parentNodeId = $('#jstree').jstree().get_node(data.selected[i]).parent;    
var parentNodeText = $('#jstree').jstree().get_node(parentNodeId).text;

var filteredArray = array.filter(function(item){
   if (item.name === parentNodeText) {
       return item;
   }  
});

$table.bootstrapTable('load', filteredArray);

根据所选的 jsTree 节点筛选 JSON 数据

Filter JSON data depending on selected jsTree node

javascript

jquery

json

jstree

bootstrap-table