[英]How to run javascript function from $(document).ready()
I'm using jsgantt library to create a Gantt chart on my web page. 我正在使用jsgantt库在网页上创建甘特图。 The problem is the following.
问题如下。
Variant 1 is not working , while Variant 2 is working . 变体1不起作用 ,而变体2正在起作用 。 The alert "Start" is displayed, while alert "Fin" is not displayed inside the function
createChartControl
. 显示警报“开始”,而在功能
createChartControl
未显示警报“ Fin”。 So, I cannot figure out why Variant 1 is not working (ie blank DIV container) and Firebug does not display any error message. 因此,我无法弄清为什么Variant 1无法正常运行(即空白的DIV容器)并且Firebug不显示任何错误消息。 Any help is highly appreciated.
非常感谢您的帮助。
Variant 1: 变体1:
<script>
function createChartControl(htmlDiv)
{
alert("Start");
var g = new JSGantt.GanttChart('g',document.getElementById(htmlDiv), 'hour');
g.setShowRes(1); // Show/Hide Responsible (0/1)
g.setShowDur(1); // Show/Hide Duration (0/1)
g.setShowComp(1); // Show/Hide % Complete(0/1)
g.setCaptionType('Resource'); // Set to Show Caption (None,Caption,Resource,Duration,Complete)
g.setFormatArr("hours","minutes")
if( g ) {
// Parameters (pID, pName, pStart, pEnd, pColor, pLink, pMile, pRes, pComp, pGroup, pParent, pOpen)
// You can also use the XML file parser JSGantt.parseXML('project.xml',g)
g.AddTaskItem(new JSGantt.TaskItem(1, 'Add minutes/hours', '', '', 'ff0000', 'http://help.com', 0, 'Ilan', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(11, 'Add support for half days', '5/14/2009 14:00', '5/14/2009 15:30', 'ff00ff', 'http://www.jsgantt.com', 0, 'Ilan', 100, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(12, 'Add minute view', '5/14/2009 16:00', '5/14/2009 17:00', '00ff00', '', 0, 'Ilan', 40, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(13, 'Add hours view', '5/14/2009 16:00', '5/14/2009 17:00', '00ffff', 'http://www.yahoo.com', 0, 'Ilan', 60, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(14, 'Add support for format options', '5/14/2009 18:00', '5/14/2009 19:00', '00ffff', 'http://www.yahoo.com', 0, 'Shlomy', 60, 0, 14, 1));
g.Draw();
g.DrawDependencies();
alert("Fin");
}
else
{
alert("not defined");
}
}
</script>
<script>
$(document).ready(function() {
createChartControl('schedule');
});
</script>
<div style="position:relative" class="gantt" id="schedule"></div>
Variant 2: 变体2:
<div style="position:relative" class="gantt" id="schedule"></div>
<script>
var g = new JSGantt.GanttChart('g',document.getElementById('schedule'), 'hour');
g.setShowRes(1); // Show/Hide Responsible (0/1)
g.setShowDur(1); // Show/Hide Duration (0/1)
g.setShowComp(1); // Show/Hide % Complete(0/1)
g.setCaptionType('Resource'); // Set to Show Caption (None,Caption,Resource,Duration,Complete)
g.setFormatArr("hours","minutes")
if( g ) {
// Parameters (pID, pName, pStart, pEnd, pColor, pLink, pMile, pRes, pComp, pGroup, pParent, pOpen)
// You can also use the XML file parser JSGantt.parseXML('project.xml',g)
g.AddTaskItem(new JSGantt.TaskItem(1, 'Add minutes/hours', '', '', 'ff0000', 'http://help.com', 0, 'Ilan', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(11, 'Add support for half days', '5/14/2009 14:00', '5/14/2009 15:30', 'ff00ff', 'http://www.jsgantt.com', 0, 'Ilan', 100, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(12, 'Add minute view', '5/14/2009 16:00', '5/14/2009 17:00', '00ff00', '', 0, 'Ilan', 40, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(13, 'Add hours view', '5/14/2009 16:00', '5/14/2009 17:00', '00ffff', 'http://www.yahoo.com', 0, 'Ilan', 60, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(14, 'Add support for format options', '5/14/2009 18:00', '5/14/2009 19:00', '00ffff', 'http://www.yahoo.com', 0, 'Shlomy', 60, 0, 14, 1));
g.Draw();
g.DrawDependencies();
}
else
{
alert("not defined");
}
</script>
UPDATE 1: I should say that Variant 1 was working when I used dhtmlxGantt library to create a chart inside the function createChartControl. 更新1:我应该说,当我使用dhtmlxGantt库在函数createChartControl中创建图表时,变体1正在工作。
UPDATE 2: I updated my sample code in Variant 1. Still it's not working - ie alert "Start" is displayed, while alert "Fin" is not displayed. 更新2:我在变体1中更新了示例代码。仍然无法正常工作-即显示警报“开始”,而未显示警报“ Fin”。
are you sure, that response you get from updateList is JSON object? 您确定从updateList获得的响应是JSON对象吗?
echo json_encode(array('a'=>'b'));
die();
If you dont response JSON object, use $.get() method. 如果您不响应JSON对象,请使用$ .get()方法。
PS: please, dont use 'updateList.php?query='+'DROP DATABASE()' try some of MVC logic. PS:请不要使用'updateList.php?query ='+'DROP DATABASE()'尝试一些MVC逻辑。
jsgantt needs global variable g
to works. jsgantt需要全局变量
g
才能起作用。 change var g
into window.g
. 将
var g
更改为window.g
。
so it will look like this 所以看起来像这样
Variant 1: 变体1:
<script>
function createChartControl(htmlDiv)
{
alert("Start");
window.g = new JSGantt.GanttChart('g',document.getElementById(htmlDiv), 'hour');
g.setShowRes(1); // Show/Hide Responsible (0/1)
g.setShowDur(1); // Show/Hide Duration (0/1)
g.setShowComp(1); // Show/Hide % Complete(0/1)
g.setCaptionType('Resource'); // Set to Show Caption (None,Caption,Resource,Duration,Complete)
g.setFormatArr("hours","minutes")
if(g) {
// Parameters (pID, pName, pStart, pEnd, pColor, pLink, pMile, pRes, pComp, pGroup, pParent, pOpen)
// You can also use the XML file parser JSGantt.parseXML('project.xml',g)
g.AddTaskItem(new JSGantt.TaskItem(1, 'Add minutes/hours', '', '', 'ff0000', 'http://help.com', 0, 'Ilan', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(11, 'Add support for half days', '5/14/2009 14:00', '5/14/2009 15:30', 'ff00ff', 'http://www.jsgantt.com', 0, 'Ilan', 100, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(12, 'Add minute view', '5/14/2009 16:00', '5/14/2009 17:00', '00ff00', '', 0, 'Ilan', 40, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(13, 'Add hours view', '5/14/2009 16:00', '5/14/2009 17:00', '00ffff', 'http://www.yahoo.com', 0, 'Ilan', 60, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(14, 'Add support for format options', '5/14/2009 18:00', '5/14/2009 19:00', '00ffff', 'http://www.yahoo.com', 0, 'Shlomy', 60, 0, 14, 1));
g.Draw();
g.DrawDependencies();
alert("Fin");
}
else {
alert("not defined");
}
}
</script>
<script>
$(document).ready(function() {
createChartControl('schedule');
});
</script>
<div style="position:relative" class="gantt" id="schedule"></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.