index.cfm
<html>
<head>
<title>FullCalander Demo</title>
<link rel='stylesheet' type='text/css' href='fullcalendar.css' />
<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='fullcalendar.min.js'></script>
</head>
<body>
<div id='calendar'></div>
</body>
</html>
Ajax调用页面。它返回下面的JSON
[
{title: 'Test event',start: '2015-02-22',
end: '2015-02-25',color:'##00ffb8',description:"<span style='color:##00ffb8;font:bold 9pt arial'>Test event(4 days from 22-25 Feb 2015) </span> <br> 22 February 2015 <br> MS,India <br><span><a href='?eManageraction=public:main.details&event_id=1'>More Details</a></span> | <span><a href='/plugins/eManager/?testaction=public:main.iCalExport&event_id=1'><img src='/plugins/eManager/includes/assets/css/images/calendar_butt_icon.gif'></a></span> <br> <span style='color:##888989'>organized by test</span>"}
,
{title: 'Test 2',start: '2015-02-21',
end: '2015-02-21',color:'##00ffb8',description:"<span style='color:##00ffb8;font:bold 9pt arial'>Test 2 </span> <br> 21 February 2015 <br> MS,India <br><span><a href='?eManageraction=public:main.details&event_id=2'>More Details</a></span> | <span><a href='/plugins/eManager/?testaction=public:main.iCalExport&event_id=2'><img src='/plugins/eManager/includes/assets/css/images/calendar_butt_icon.gif'></a></span> <br> <span style='color:##888989'>organized by test</span>"}
]
当我运行以上代码时,我得到了日历视图,但没有在日历视图上加载事件。ajax调用返回正确的JSON数据。我还将尝试将URL替换为上面的JSON数据,以便在日历视图中加载事件。这里怎么了?请任何人帮助我。我使用的是Fullcalense版本1.6.4
问题与start
和end
有关。您需要查看事件对象文档。
基本上,您需要在start
和end
中定义时间,类似于:
start: '2015-02-22T00:00:00',
end: '2015-02-25T00:00:00'
检查工作的jsfiddle。
旁注:description
中的所有颜色在您使用过的对象中都无效。您有两个#
(例如:颜色:##00ffb8)。