绑定 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 值,它将起作用。