我有一个JSON格式
{
"identifier": "id",
"items": [{
"id": 0,
"duration": 1,
"startdate": "2011-11-24",
"percentage": 0,
"name": "The quick brown fox jumps over the lazy dog",
"taskOwner": "RAK",
"children": [{
"id": 1,
"duration": 20,
"startdate": "2011-11-26",
"percentage": 40,
"name": "Aquire fox",
"taskOwner": "Fox",
"previousTaskId": "",
"children": [{
"id": 2,
"duration": 40,
"startdate": "2011-11-28",
"percentage": 70,
"name": "Obtain Dog",
"taskOwner": "Dog",
"previousTaskId": "1",
"children": [{
"id": 3,
"duration": 60,
"startdate": "2011-11-25",
"percentage": 80,
"name": "Fox does his jump",
"taskOwner": "jump",
"previousTaskId": "3",
"children": []
}]
}]
}]
}]
}
我正在尝试使用以下代码访问它。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="${page.url.context}/res/components/gant_chart/css/claro.css">
<style type="text/css">
@import "${page.url.context}/res/components/gant_chart/css/gantt.css";
</style>
<script src='${page.url.context}/res/components/gant_chart/dojo/dojo.js'></script>
<script type="text/javascript">
setTimeout(function () {
var temp = eval('(${results})'); //CALLING JSON DATA
dojoConfig = {
async: false,
parseOnLoad: true
};
dojo.require("dojo.parser");
dojo.require("dojox.gantt.GanttChart");
dojo.require("dojo._base.declare");
dojo.require("dojo.query");
dojo.require("dojox.gantt.GanttProjectItem");
dojo.require("dojox.gantt.GanttTaskItem");
dojo.require("dojo.dom");
dojo.require("dojo.domReady");
dojo.addOnLoad(function () {
var ganttChart = new dojox.gantt.GanttChart({
readOnly: true,
height: 400, // optional: chart height in pixel, default is 400px
width: 1000,
withResource: true
}, "gantt");
for (var i = 0; i < temp.items.length; i++) {
var projectItem = temp.items[i];
var startDate = projectItem.startdate.split("-");
var project = new dojox.gantt.GanttProjectItem({
id: projectItem.id,
name: projectItem.name,
startDate: new Date(startDate[0], (parseInt(startDate[1]) - 1), startDate[2]),
});
var Tasks = projectItem.tasks;
for (var j = 0; j < Tasks.length; j++) {
var Task = Tasks[j];
var starttime = Task.startdate.split("-")
var task = new dojox.gantt.GanttTaskItem({
id: Task.id,
name: Task.name,
startTime: new Date(starttime[0], (parseInt(starttime[1]) - 1), starttime[2]),
duration: Task.duration,
percentage: Task.percentage,
previousTaskId: Task.previousTaskId,
taskOwner: Task.taskOwner
});
project.addTask(task);
}
ganttChart.addProject(project);
}
ganttChart.init();
});
}, 0); //end of dojo.addonload function
</script>
</head>
<body class="claro">
<div class="dashlet site-welcome">
<div class="title">Gantt chart</div>
<div class="body">
<div class="ganttContent" style="margin:10px;">
<div id="gantt"></div>
</div>
</div>
</div>
</body>
</html>
我做错了什么？代码没有按照我的意愿返回子类。有人有建议吗？
答案 0 :(得分：0)
您正试图获取projectItem.tasks - 该数组中没有tasks属性。改为定位.children。
答案 1 :(得分：0)
我发现的第一件事是你使用
var Tasks = projectItem.tasks;
但该对象不存在。
我认为应该是：
var Tasks = projectItem.children;
好吧，在这之后你欠我甜甜圈，但是这样的东西搞得一团糟：
var recurseChildren = function(parent) {
var tasks = parent.children;
for (var j = 0; j < tasks.length; j++) {
var task = tasks[j];
var startTime = task.startdate.split("-")
var taskItem = new dojox.gantt.GanttTaskItem({
id: task.id,
name: task.name,
startTime: new Date(startTime[0], (parseInt(startTime[1]) - 1), startTime[2]),
duration: task.duration,
percentage: task.percentage,
previousTaskId: task.previousTaskId,
taskOwner: task.taskOwner
});
project.addTask(taskItem);
// Keynote here -- now we repeat ourselves for each child layer.
recurseChildren(task);
}
}
var ganttChart = new dojox.gantt.GanttChart({
readOnly: true,
height: 400,
width: 1000,
withResource: true
}, "gantt");
for (var i = 0; i < temp.items.length; i++) {
var projectItem = temp.items[i];
var startDate = projectItem.startdate.split("-");
var project = new dojox.gantt.GanttProjectItem({
id: projectItem.id,
name: projectItem.name,
startDate: new Date(startDate[0], (parseInt(startDate[1]) - 1), startDate[2]),
});
recurseChildren(projectItem);
ganttChart.addProject(project);
}
ganttChart.init();