在FullCalendar dayClick事件中,我可以获取点击日期中已存在的事件吗？

Question

在FullCalendar dayClick事件中,我可以获取点击日期中已存在的事件吗？

http://arshaw.com/fullcalendar/docs/mouse/dayClick/

让我解释一下我的项目我正在编写一个简单的php网站,允许用户在日历上添加/编辑事件.

• 只有单个事件可以添加到日期.
• 如果用户单击空日期,将显示新事件弹出窗口(我使用dayclick事件).
• 如果用户使用现有事件单击日期,将显示编辑事件弹出窗口(我使用eventclick事件).

问题是当用户点击具有现有事件的日期的事件区域(上部区域或底部区域)之外时,它会提高日期点击而不是事件点击.如果日期中存在现有事件,如何触发eventclick事件并跳过dayclick事件？

Answer 1

您的事件是存储在客户端还是服务器端？如果在客户端,如果您希望在单击时间内执行该事件,则应该特别有效:

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            $('#calendar').fullCalendar('clientEvents', function(event) {
                if(event.start <= date && event.end >= date) {
                    return true;
                }
                return false;
            });
    }
});

这将给出与点击时间重叠并存储在客户端的事件.对于全天的广告位,它会在当天重叠所有活动.

如果您希望该日期的所有事件本身,无论是否单击了allDay插槽或时隙.

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            if(!allDay) {
                // strip time information
                date = new Date(date.getFullYear(), date.getMonth(), date.getDay());
            }
            $('#calendar').fullCalendar('clientEvents', function(event) {
                if(event.start <= date && event.end >= date) {
                    return true;
                }
                return false;
            });
    }
});

如果您的事件存储在服务器上,您将需要获取dayClick回调中提供的日期,并使用它来构建对服务器的调用,以获得您需要的任何格式的信息.

编辑如果进行往返或尝试以其他方式获取信息

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            var startDate = new Date(date.getFullYear(), date.getMonth(), date.getDay(), 0, 0, 0).getTime();
            var endDate = new Date(date.getFullYear(), date.getMonth(), date.getDay(), 23, 59, 59).getTime();
            var cache = new Date().getTime();
            $.getJSON("/json-events.php?start="+startDate+"&end="+endDate+"&_="+cache,
                function(data) {
                    // do stuff with the JSOn data
                }
    }
});

如果您不想要往返,您还可以查看fullCalendar.js中的refetchEvents中发生的情况.如果你不介意偏离fullCalendar主干,你可以在某个地方保存已获取的事件,这样你就不会进行大量的DOM操作(取决于事件的数量,因为它们变得很大,会变得难以处理).

Answer 2

我自己也遇到了这个问题,同时找到了一个将公共假期带入日历的解决方案.我发现这是一整天活动的好方法.我希望这可以帮助其他人进一步发展.

$('#calendar').fullCalendar({                
    eventClick: function (event) {
        ShowEditScreen(event.id);
    },
    dayClick: function (date) {
        var events = $('#calendar').fullCalendar('clientEvents');
        for (var i = 0; i < events.length; i++) {
            if (moment(date).isSame(moment(events[i].start))) {
                ShowEditScreen(events[i].id);
                break;
            }
            else if (i == events.length - 1) {
                ShowCreateNew(date);
            }
        }
    }
});