[英]jquery.gantt plugin doesn't do anything
What I'm trying to do: Installing the jquery.gantt plugin and running the basic example given in docs. 我想做的是:安装jquery.gantt插件并运行docs中给出的基本示例。
How it fails: The javascript doesn't do anything, the target DOM is left unchanged. 失败方式: javascript没有执行任何操作,目标DOM保持不变。
What I did: I checked that the css file style.css
, and the js jquery.fn.gantt.js
were installed. 我做了什么:我检查了css文件
style.css
和js jquery.fn.gantt.js
是否已安装。 I checked the images were installed. 我检查了图像是否已安装。 I looked at the source of the docs.
我看了看文档的来源。
Some code: I took it from the docs as an example, yet never managed to make it work. 一些代码:我以文档中的示例为例,但从未设法使其工作。
<script type="text/javascript">
<!--
$(".ganttdiv").gantt({
source: [{
name: "Example",
desc: "Lorem ipsum dolor sit amet.",
values: [ {
to: "/Date(1328832000000)/",
from: "/Date(1333411200000)/",
desc: "Something",
label: "Example Value",
customClass: "ganttRed",
dataObj: foo.bar[i]
}]
}],
scale: "weeks",
minScale: "weeks",
maxScale: "months",
onItemClick: function(data) {
alert("Item clicked - show some details");
},
onAddClick: function(dt, rowId) {
alert("Empty space clicked - add an item!");
}
});
//-->
</script>
<div class="ganttdiv"></div>
My question: 我的问题:
I would like to understand what I did wrong, or just to see the code of a working example of Jquery.gantt. 我想了解我做错了什么,或者只是看一下Jquery.gantt的工作示例的代码。 Any advice on how to debug this problem would be gladly appreciated too.
任何有关如何调试此问题的建议也将不胜感激。
Ok I managed to make it work. 好吧,我设法使其工作。
The default css forces you to put class='gantt' on the target DOM, and not 'ganttdiv' as I did. 默认的css会强制您将class ='gantt'放在目标DOM上,而不是像我所做的那样'ganttdiv'。
Here is a working exemple, I hope it be will useful to someone. 这是一个工作示例,希望对某人有用。
<script type="text/javascript">
<!--
$( function(){$(".gantt").gantt({
source: [{
name: "Example",
desc: "Lorem ipsum dolor sit amet.",
values: [ {
to: "/Date(1376954000000)/",
from: "/Date(1375854000000)/",
desc: "Something",
label: "Example Value",
customClass: "ganttRed",
}]
}],scale: "weeks",
minScale: "weeks",
maxScale: "months",
navigate:"scroll",
onItemClick: function(data) {
alert("Item clicked - show some details");
},
onAddClick: function(dt, rowId) {
alert("Empty space clicked - add an item!");
}
});
});
//-->
</script>
<div class="gantt"></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.