Fullcalendar.io:如何在agendaWeek中每行显示一个事件然后混合在一起？

Question

我使用Fullcalendar.io v2

在我的agendaWeekmod中,我有事件,所有这些事件都显示在日期广场的一行中.所以,我有更多的事件,然后是更多的事件块.

如何每行显示一个事件？喜欢monthmod.我有更多的事件,然后更高的日期块我(高度).也许,很难使用像这样的函数eventRender,因为如果你检查.fs-event元素(web开发者工具),你会看到事件块使用position:absolute;top:300px;left:33%...所以我不知道该怎么做.

我想要这样的东西:

Answer 1

您可以向您的事件添加一个类，并尝试使用 CSS 自定义该事件

作为示例，您可以使用样式

.test {
    width: 100%;
    height: auto;
    position: relative !important;
    left: 0% !important;
    margin-right: 0% !important;
}

和这样的事件：

{
    title: 'Lunch',
    start: '2014-06-09T10:30:00',
    className: 'test'
},

如果这就是你想要实现的目标，请看看这个Fiddle

另外，通过一些解决方法，您可以使用eventAfterRender回调来调整特定行的高度。但这不是非常安全的解决方案，它需要一些调整：

eventAfterRender: function( event, element, view ) { 
    var row = $(".fc-slats tr:contains('"+ moment(event.start).format('ha') + "')");
    if (moment(event.start).format('mm') != '00')
    {
        row = row.next();
    }
    row.height(element.height()+row.height());
}

https://jsfiddle.net/m5uupf9x/3/