jsTree JSON問題

Question

我正在使用jstree.js插件的某個項目模塊。 我通過Web服務調用獲取以下JSON：

[ 
    { 
     "name":"Folder1", 
     "attributes": { 
      "SubFolder1-1":"value1-1", 
      "SubFolder1-2":"value1-2", 
      ... 
      "SubFolder1.7":"value1-7", 
      "SubFolder1.8":"value1-8" 
     } 
    }, { 
     "name":"Folder2", 
     "attributes": { 
      "SubFolder2-1":"value2-1" 
     } 
    }, { 
     "name":"Folder3", 
     "attributes": { 
      "SubFolder3-1":"value2-1" 
      } 
    } 
] 

但jsTree.js不接受JSON格式，它接受格式如下：

{ 
    "data" : "node_title", 
    "attr" : { 
      "id" : "node_identificator", 
      "some-other-attribute" : "attribute_value" 
    }, 
    "children" : [ /* an array of child nodes objects */ ] 
} 

應對方法：

var new_avatar = new Array(); 
new_avatar = data.attributeSets; 

// Hardcoded data for JSTree 
var dirn = {}; 
var final_child = {}; 
dirn = "["; 

final_child = "["; 
for (var info in new_avatar) { 
    for (var detailInfo in new_avatar[info].attributes) { 
     ckey = detailInfo; // Key 
     cval = new_avatar[info].attributes[detailInfo]; // Key => Value 
     final_child += '{ "data": "' + ckey + '",'; 
     final_child += ' "attr": { "rel":"directory" },'; 
     final_child += ' "children": [ "' + cval + '" ] },'; 
    } 
} 

final_child = final_child.substring(0, final_child.length - 1);  //removing last comma so it would be a valid JSON 
final_child += " ] "; //final close to this JSON 

for (var info in new_avatar) { 
    dirn += '{ "data": "' + new_avatar[info].name + '" ,'; 
    dirn += ' "attr": { "rel":"directory" }, '; 
    dirn += ' "children": ' + final_child + " }, ";  
    // Putting final_child in so it will build level 2 + level 3 (level 3 child is just value declared in final_child children above) 
} 

dirn = dirn.substring(0, dirn.length - 2);  // removing whitespace + comma 
dirn += " ] "; // this is main tree data var end box 

dirn = $.parseJSON(dirn); // parse the whole dirn variable so it would be an array and ready to feed to jstree. 

$("#tree2").jstree({ 
plugins: ['themes', 'json_data', "ui"], 
json_data: { 

    "data": dirn, 

    }, 
themes: { 
    theme: 'default' 
}, 
checkbox: { 
    real_checkboxes: true, 
    two_state: true 
}, 
"types": { 
    "types": { 
     "disabled": { 
      "check_node": false, 
      "uncheck_node": false 
     }, 
     "directory": { 
      "check_node": false, 
      "uncheck_node": false 
     } 
    } 
} 
}); 

當前輸出：

顯示json不是有效字符串的錯誤。

預期輸出：

Answer 1

我得到了解決，現在是工作的罰款。謝謝大家的關注。

var new_avatar = new Array(); 
new_avatar = data.attributeSets; 

var dirn = {}; 
var final_child = {}; 
var nodeChildren = {}; 

//Collect children for each node 
for (var info in new_avatar) { 

final_child = "["; 
for (var detailInfo in new_avatar[info].attributes) { 
    ckey = detailInfo; // Key 
    cval = new_avatar[info].attributes[detailInfo]; // Key => Value 
    final_child += '{ "data": "' + ckey + '",'; 
    final_child += ' "attr": { "rel":"directory" },'; 
    final_child += ' "children": [ "' + cval + '" ] },'; 
} 
final_child = final_child.substring(0, final_child.length - 1);  //removing last comma so it would be a valid JSON 
final_child += " ] "; //final close to this JSON 
nodeChildren[info] = final_child; 
} 

    // Attached collected nodes to respective parents 
    dirn = "["; 
    for (var info in new_avatar) { 
     dirn += '{ "data": "' + new_avatar[info].name + '" ,'; 
     dirn += ' "attr": { "rel":"directory" }, '; 
     dirn += ' "children": ' + nodeChildren[info] + " }, ";  //putting final_child in so it will buld level 2 + level 3 (level 3 child is just value declared in final_child children above) 
    } 
    dirn = dirn.substring(0, dirn.length - 2);  
    dirn += " ] "; 

    dirn = $.parseJSON(dirn); 

$("#tree2").jstree({ 
    plugins: ['themes', 'json_data', "ui", "dnd"], 
    json_data: { 

    "data": dirn, 

    }, 
    themes: { 
    theme: 'default' 
    }, 
    checkbox: { 
    real_checkboxes: true, 
    two_state: true 
    }, 
    "types": { 
    "types": { 
     "disabled": { 
      "check_node": false, 
      "uncheck_node": false 
     }, 
     "directory": { 
      "check_node": false, 
      "uncheck_node": false 
     } 
    } 
    } 
});