JSTree不會呈現從JS變量我的JSON數據

我有一個JavaScript JSON變量，我試圖將其饋送給JSTree。它沒有渲染任何東西。JSTree不會呈現從JS變量我的JSON數據

{ 
    "id":1, 
    "data":"GDC", 
    "depth":-1, 
    "children":[ 
     { 
     "id":2, 
     "data":"SICS", 
     "depth":0, 
     "children":[ 
      { 
       "id":5, 
       "data":"Collaboration", 
       "depth":1, 
       "children":[ 
        { 
        "id":10, 
        "data":"Contact Center", 
        "depth":2, 
        "children":[ 
         { 
          "id":607, 
          "data":"Subscription", 
          "depth":3, 
          "children":[ 
           { 
           "depth":4, 
           "id":608, 
           "children":[ 

           ], 
           "data":"Optimization" 
           } 
          ] 
         }, 
         { 
          "id":606, 
          "data":"Transaction", 
          "depth":3, 
          "children":[ 
           { 
           "depth":4, 
           "id":664, 
           "children":[ 

           ], 
           "data":"Planning" 
           }, 

           { 
           "depth":4, 
           "id":672, 
           "children":[], 

           } 
          ] 
         } 
        ] 
        }, 
        { 
        "id":11, 
        "data":"Productivity", 
        "depth":2, 
        "children":[ 
         { 
          "id":1231, 
          "data":"DevOps", 
          "depth":3, 
          "children":[ 
           { 
           "depth":4, 
           "id":1280, 
           "children":[ 

           ], 
           "data":"Deployment" 
           } 
          ] 
         }, 
         { 
          "id":1229, 
          "data":"Tool Support", 
          "depth":3, 
          "children":[ 
           { 
           "depth":4, 
           "id":1232, 
           "children":[ 

           ], 
           "data":"UCDT" 
           }, 

           { 
           "depth":4, 
           "id":1237, 
           "children":[ 

           ], 
           "data":"PCAT" 
           } 
          ] 
         } 
        ] 
        } 
       ] 
      }, 
      { 
       "id":3, 
       "data":"Security ", 
       "depth":1, 
       "children":[ 
        { 
        "id":284, 
        "data":"Security", 
        "depth":2, 
        "children":[ 
         { 
          "id":1286, 
          "data":"Subscription", 
          "depth":3, 
          "children":[ 
           { 
           "depth":4, 
           "id":1491, 
           "children":[ 

           ], 
           "data":"Software Strategy" 
           }, 
           { 
           "depth":4, 
           "id":1496, 
           "children":[ 

           ], 
           "data":"Change Support/Migration" 
           } 
          ] 
         }, 
         { 
          "id":1285, 
          "data":"Transaction", 
          "depth":3, 
          "children":[ 
           { 
           "depth":4, 
           "id":1287, 
           "children":[ 

           ], 
           "data":"CRD" 
           }, 
           { 
           "depth":4, 
           "id":1290, 
           "children":[ 

           ], 
           "data":"NIP" 
           } 

          ] 
         } 
        ] 
        } 
       ] 
      } 
     ] 
     } 
    ] 
}

我將這些數據加入到JSTree中，但它沒有渲染任何東西。我試過使用基本的JSON數據，但它需要。當我有嵌套的孩子時，它似乎失敗了。

個JS代碼：

$(function() { 
$('#jstree').jstree({ 
    'json_data' : { 
     'data' : data 
    } 
}); 
});

任何想法？

來源

2017-02-16 Yajat Singh

提供再現問題的演示。應該將'data'更改爲'text'每個文檔 – charlietfl

[將Json作爲變量加載到jsTree中可能的重複]（http://stackoverflow.com/questions/29498426/loading-json-as-variable-into-jstree） – Saadi

請包括您使用jsTree渲染此JSON數據的JavaScript/jQuery代碼。問題可能比數據更多地存在於代碼中。 – JohnH

以下是更新後的JSON（你的「數據」更改爲「文本」屬性）：

var data = { 
     "id": 1, 
     "text": "GDC", 
     "depth": -1, 
     "children": [ 
      { 
       "id": 2, 
       "text": "SICS", 
       "depth": 0, 
       "children": [ 
        { 
         "id": 5, 
         "text": "Collaboration", 
         "depth": 1, 
         "children": [ 
         { 
          "id": 10, 
          "text": "Contact Center", 
          "depth": 2, 
          "children": [ 
           { 
            "id": 607, 
            "text": "Subscription", 
            "depth": 3, 
            "children": [ 
             { 
              "depth": 4, 
              "id": 608, 
              "children": [ 

              ], 
              "text": "Optimization" 
             } 
            ] 
           }, 
           { 
            "id": 606, 
            "text": "Transaction", 
            "depth": 3, 
            "children": [ 
             { 
              "depth": 4, 
              "id": 664, 
              "children": [ 

              ], 
              "text": "Planning" 
             }, 

             { 
              "depth": 4, 
              "id": 672, 
              "children": [], 

             } 
            ] 
           } 
          ] 
         }, 
         { 
          "id": 11, 
          "text": "Productivity", 
          "depth": 2, 
          "children": [ 
           { 
            "id": 1231, 
            "text": "DevOps", 
            "depth": 3, 
            "children": [ 
             { 
              "depth": 4, 
              "id": 1280, 
              "children": [ 

              ], 
              "text": "Deployment" 
             } 
            ] 
           }, 
           { 
            "id": 1229, 
            "text": "Tool Support", 
            "depth": 3, 
            "children": [ 
             { 
              "depth": 4, 
              "id": 1232, 
              "children": [ 

              ], 
              "text": "UCDT" 
             }, 

             { 
              "depth": 4, 
              "id": 1237, 
              "children": [ 

              ], 
              "text": "PCAT" 
             } 
            ] 
           } 
          ] 
         } 
         ] 
        }, 
        { 
         "id": 3, 
         "text": "Security ", 
         "depth": 1, 
         "children": [ 
         { 
          "id": 284, 
          "text": "Security", 
          "depth": 2, 
          "children": [ 
           { 
            "id": 1286, 
            "text": "Subscription", 
            "depth": 3, 
            "children": [ 
             { 
              "depth": 4, 
              "id": 1491, 
              "children": [ 

              ], 
              "text": "Software Strategy" 
             }, 
             { 
              "depth": 4, 
              "id": 1496, 
              "children": [ 

              ], 
              "text": "Change Support/Migration" 
             } 
            ] 
           }, 
           { 
            "id": 1285, 
            "text": "Transaction", 
            "depth": 3, 
            "children": [ 
             { 
              "depth": 4, 
              "id": 1287, 
              "children": [ 

              ], 
              "text": "CRD" 
             }, 
             { 
              "depth": 4, 
              "id": 1290, 
              "children": [ 

              ], 
              "text": "NIP" 
             } 

            ] 
           } 
          ] 
         } 
         ] 
        } 
       ] 
      } 
     ] 
    }

及以下正確的js代碼：

$('#jstree').jstree({ 
     'core': { 
      'data': data 
     } 
    });

來源

2017-02-17 04:26:16 Namita

非常感謝你！ –

JSTree不會呈現從JS變量我的JSON數據

回答

相關問題