Javascript jsTree JSON问题
我正在使用jstree.js插件开发某个项目模块。 我通过web服务调用获得以下JSON:Javascript jsTree JSON问题,javascript,jquery,json,jstree,Javascript,Jquery,Json,Jstree,我正在使用jstree.js插件开发某个项目模块。 我通过web服务调用获得以下JSON: [ { "name":"Folder1", "attributes": { "SubFolder1-1":"value1-1", "SubFolder1-2":"value1-2", ... "SubFolder1.7":"value1-7", "
[
{
"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不是有效字符串的错误
预期产出:
我找到了解决方案,现在工作正常。谢谢大家表现出兴趣
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
}
}
}
});
您是否尝试过传递eval(数据)而不是直接传递数据?因为eval是一种糟糕的做法,所以我没有尝试过!不总是这样。您还可以(并且必须)使用JSON解析JSON。parse(myServiceResponseString)是的!我尝试使用JSON.parse,但它显示了相同的错误消息!所以我猜JSON字符串在构造时是无效的…请在最后发布JSON.stringify(dirn)的结果,然后再将其放入js_树中