JsTree复选框选择所有具有相应父级的字段

时间:2019-02-18 11:31:27

标签: javascript html jstree

我正在使用JsTree作为过滤器选项。

现在,在选择父节点时,它会在单个数组中提供所有子项和子项。

所以我无法确定哪个孩子属于哪个父母。

这是我的示例代码,

$(function () {
    $("#tree").jstree({
        "checkbox": {
            "keep_selected_style": false
        },
            "plugins": ["checkbox"],
            'core' : {
                'data' :  [
  {
    "id": "ALL",
    "text": "ALL",
    "children": [

      {
        "id": "TWO",
        "text": "TWO",
        "children": [
          {
            "id": "C2",
            "text": "C2",
            "children": [
              {
                "id": "S2",
                "text": "S2"
              }
            ]
          }
        ]
      }
    ]
  }
]
            }
    });

    var selected_items = {}

    $("#tree").bind("select_node.jstree", function (event, data) { 
               console.log(data.node);
                         });
});

它给孩子,

[
  "S2",
  "C2",
  "S3",
  "T3",
  "C3",
  "D3",
  "ONE",
  "TWO",
  "THREE"
]

那么我该如何识别孩子及其父母。

1 个答案:

答案 0 :(得分:0)

您可以使用选定的nodeId从树中找回节点,从而为您提供所有子级和父级关系

$("#tree").bind("select_node.jstree", function (event, data) {    
        var jsonOfSelectedNode = $('#tree').jstree(true).get_json(data.node, {flat:true})
        // debug here and view 
});

jsonOfSelectedNode 将为您提供所有必需的父子数据