FullCalendar事件仅在月视图中显示

2018-06-29 01:42:31

我正在使用FullCalendar http://fullcalendar.io/在网页上显示一些事件。

日历是这样创建的

$('#calendar').fullCalendar({
        header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
        },
        allDayDefault: false,
        selectable: true,
        selectHelper: true,
        editable: true,
        eventLimit: true, // allow "more" link when too many events
   });

事件是通过renderEvent操作（而不是json feed）创建的

$('#calendar').fullCalendar('renderEvent', newEvent, 'stick');

newEvent是这样创建的

newEvent = {
                title : 'mytitle',
                start : startDate,
                allDay: false,
                id: eventId,
                description: 'my test event'
            };

问题是事件在月视图中正确显示，但未在周视图或日视图中显示。

UPDATE

我正在使用这种日期格式：2015-02-01T01：00：00

我已经创建了一个重现你的代码的笨蛋。我在代码中看到的唯一问题是创建事件时预期的逗号。

所以我用一个新的时刻对象来创建事件 - 这意味着现在。

  var startDate = moment();
  var eventId = 123;
  var newEvent = {
                title : 'mytitle',
                start : startDate,
                allDay: false,
                id: eventId,   //Is this comma that was missing in your code
                description: 'my test event'
            };

我用你正在做的相同的代码添加它：

$('#calendar').fullCalendar('renderEvent', newEvent, 'stick');

正如你可以检查一下所有的工作正常，所以你提供给我们的代码的唯一问题可能是：

缺少的逗号。

eventId变量是错误的

startDate变量是错误的

另外，如果您查看渲染事件的文档，则您没有正确使用“stick”变量。它应该是一个布尔值。在你的代码正在工作，因为你可以检查行9229版本2.3.1它的比较作为表达式，所以任何字符串（非空）将是真实的。你可以在这个答案中有更多关于这个的信息：https://stackoverflow.com/a/4923684/2686163

所以，如果你设置第三个参数棒为：

真正

'棒'

'不粘'

'假'

'随你'

...总是被解析为粘性，并添加到stickySource 。但是，正如@slicedtoad所说的，你应该改变它以避免将来版本出现问题。

你的代码没有任何问题。但是你正在以非标准的方式做一些事情。尝试修复它们，问题可能会消失。

你用来添加事件的方法不是正确的。在FullCalendar术语中， render意味着将数据显示到日历的过程。所以当你renderEvent ，你只是告诉它在屏幕上显示一个事件。然后stick让它坚持（种）。

相反，你应该使用addEventSource 。它可以用来添加任何事件源（本地或远程）。事件源可以是从JSON提要到一个事件的本地数组的任何东西。

这应该工作：

$('#calendar').fullCalendar('addEventSource',[{
    title : 'mytitle',
    start : startDate,
    allDay: false,
    id: eventId,
    description: 'my test event'
}]);

这给你一个会持续整个会议的事件。它还具有与所有其他fullcalendar选项和回调完美搭配的优势。

我通过使用您的代码并在我身边进行了一些修改而制作了小提琴。它工作正常。我希望它能为你工作。欢迎您的意见。

码

HTML

<body>
    <div id='calendar'></div>
</body>

脚本

<script type='text/javascript'>
$(document).ready(function(){
    fullCalObj = $('#calendar').fullCalendar({
         header: {
             left: 'prev,next today',
             center: 'title',
             right: 'month,agendaWeek,agendaDay'
         },
         allDayDefault: false,
         selectable: true,
         selectHelper: true,
         editable: true,
         eventLimit: true, // allow "more" link when too many events
     });

    var newEvent = {
        title : 'mytitle',
        start : '2015-04-22',
        allDay: false,
        id: 1,
        description: 'my test event'
    };

    fullCalObj.fullCalendar('renderEvent', newEvent, 'stick');
});
</script>

链接地址: http://www.djcxy.com/p/81161.html

上一篇: FullCalendar events shown in month view only

下一篇: Showing day view of event on event click within an month or year view