绑定 json parent-child 列表到 jstree
Binding json parent-child list to jstree
我有一个嵌套的 objects (parent-child) 列表,我使用 jstree 插件来分层显示它们。
数据库列表:
ID Name ParentId
1 A NULL
2 B NULL
5 a1 1
6 b1 2
9 a11 5
10 a12 5
11 b12 6
将列表转换为 json 及其 children:
[{"children":[{"children":[{"children":[],"id":9,"text":"a11","ParentId":5},{"children":[],"id":10,"text":"a12","ParentId":5}],"id":5,"text":"a1","ParentId":1}],"id":1,"text":"A","ParentId":null},{"children":[{"children":[{"children":[],"id":11,"text":"b12","ParentId":6}],"id":6,"text":"b1","ParentId":2}],"id":2,"text":"B","ParentId":null},{"children":[{"children":[],"id":9,"text":"a11","ParentId":5},{"children":[],"id":10,"text":"a12","ParentId":5}],"id":5,"text":"a1","ParentId":1},{"children":[{"children":[],"id":11,"text":"b12","ParentId":6}],"id":6,"text":"b1","ParentId":2},{"children":[],"id":9,"text":"a11","ParentId":5},{"children":[],"id":10,"text":"a12","ParentId":5},{"children":[],"id":11,"text":"b12","ParentId":6}]
ajax:
success: function (x) {
$('#jstree').jstree({
'core': {
'data': jQuery.parseJSON(x)
}
}); }
问题是当 json objects 第一次加载到页面时,jstree 显示所有节点,甚至是它们的子节点;在同一水平。只有当我展开一个 parent 节点时,然后 children 才能正确地进入它们的 parent 之下并从第一层消失。
为什么会这样?谢谢。
虽然您的 JSON 数据结构格式正确,但分配的 'id' 值不是唯一的。根部的一些节点与一些嵌套的子节点具有相同的 id。这会在树数据中产生冲突,因为 jsTree 需要唯一的 ID。如果您可以计算整个树中节点的唯一 id 值,它将起作用。
我有一个嵌套的 objects (parent-child) 列表,我使用 jstree 插件来分层显示它们。
数据库列表:
ID Name ParentId
1 A NULL
2 B NULL
5 a1 1
6 b1 2
9 a11 5
10 a12 5
11 b12 6
将列表转换为 json 及其 children:
[{"children":[{"children":[{"children":[],"id":9,"text":"a11","ParentId":5},{"children":[],"id":10,"text":"a12","ParentId":5}],"id":5,"text":"a1","ParentId":1}],"id":1,"text":"A","ParentId":null},{"children":[{"children":[{"children":[],"id":11,"text":"b12","ParentId":6}],"id":6,"text":"b1","ParentId":2}],"id":2,"text":"B","ParentId":null},{"children":[{"children":[],"id":9,"text":"a11","ParentId":5},{"children":[],"id":10,"text":"a12","ParentId":5}],"id":5,"text":"a1","ParentId":1},{"children":[{"children":[],"id":11,"text":"b12","ParentId":6}],"id":6,"text":"b1","ParentId":2},{"children":[],"id":9,"text":"a11","ParentId":5},{"children":[],"id":10,"text":"a12","ParentId":5},{"children":[],"id":11,"text":"b12","ParentId":6}]
ajax:
success: function (x) {
$('#jstree').jstree({
'core': {
'data': jQuery.parseJSON(x)
}
}); }
问题是当 json objects 第一次加载到页面时,jstree 显示所有节点,甚至是它们的子节点;在同一水平。只有当我展开一个 parent 节点时,然后 children 才能正确地进入它们的 parent 之下并从第一层消失。 为什么会这样?谢谢。
虽然您的 JSON 数据结构格式正确,但分配的 'id' 值不是唯一的。根部的一些节点与一些嵌套的子节点具有相同的 id。这会在树数据中产生冲突,因为 jsTree 需要唯一的 ID。如果您可以计算整个树中节点的唯一 id 值,它将起作用。