9

我一天有很多活动，它按预期工作，但现在查看月份视图，我的日历网格比预期的要高得多。我想从月视图中隐藏其中的一些事件，例如带有视觉查询的摘要，表明这一天的内容比可以显示的要多。

我可以使用 eventRender 并返回 false，但我想知道某一天有多少个事件，所以我可以将渲染限制在 4 个左右，然后也许我会添加一个显示“更多...”的事件

所以问题可能是：如何计算给定日期的事件？

或者这更像是一个功能请求来公开月视图的最大计数器？

谢谢

4

7 回答 7

4

从 FullCalendar 2.1.0 开始，包含此功能，只需使用：

$('#calendarBlock').fullCalendar({
    eventLimit: true
    [...]
});

演示：http ://arshaw.com/js/fullcalendar-2.1.0-beta2/demos/agenda-views.html

文档： http: //fullcalendar.io/docs/display/eventLimit/

于 2015-05-14T19:02:54.463 回答
2

我有类似的要求，正在考虑做这样的事情：

在 json 提要中，我将返回包含每天事件计数的特殊事件。

使用适当的完整日历 eventRender 回调，我只会根据视图显示这些特殊的总计数事件，方法是在 eventRender() 中为我不想看到的任何事件返回 false。

我还没有实现这个，但也许它可能是一个有效的途径。如我错了请纠正我。

于 2010-07-30T20:24:31.360 回答
1

这个有缺陷的（大部分被废弃的）插件确实确切地你要什么。检查一下，并随时做出贡献。 警告：这是一个 hack，但 fullcalendar 本身有一个需要大量工作的 API。大多数重要部件都被困在一个封闭件中，这使得它很难扩展。除非你想编辑插件的源代码，否则真的没有办法做到这一点。

话虽如此，这是我发现的最接近您所要求的内容： https ://github.com/lyconic/fullcalendar/tree/view-more

于 2011-02-07T22:20:24.873 回答
1

目前不可能。查看功能请求： http ://code.google.com/p/fullcalendar/issues/detail?id=304

于 2010-04-09T02:12:49.317 回答
1

您不需要花费太多精力来计算事件的总数。我有一个简单的方法来计算我的 fullCalendar 上的总事件。在中eventAfterAllRender，写这样的东西，

eventAfterAllRender: function(view) {
                    var allevents = $('#calendar').fullCalendar('clientEvents');
                    var countevents = 0;
                    if( allevents.length ) {
                        countevents = countevents + allevents.length;
                    }
                    if(!countevents) {
                        // alert('event count is'+countevents);
                        console.log('event count is',countevents);
                    }
                }

-calendar我的日历在哪里#

这就是我的全部做法。我从这里向左走。但我敢肯定，如果你loading: function()在 fullCalendar 上尝试一些东西来根据你的意愿限制事件的数量，这并没有那么难。

不过谢谢。

于 2014-11-27T13:21:56.677 回答
0

我做了这样的事情：

function(start, end, callback) {
                var viewName = $("#calendar").fullCalendar('getView');
                var startTime = Math.round(start.getTime() / 1000);
                var endTime = Math.round(end.getTime() / 1000);
                MyWebService.MyWebMethod.GetEventsByView(startTime, endTime, viewName.name,
                    function(args) {
                        callback(args);
                    },
                    function(error) {
                        var e = error;
                    }
                );
            }

在这里，该GetEventsByView方法返回一个分组集用于月视图和详细集用于议程周和日视图。但是为了让它正常工作，我必须设置lazyFetching:false日历。

于 2010-09-28T18:21:56.590 回答
0

我正在这样做

CSS：

        .MaxHght
        {
        height:16px;
        }
        .viewMore
        {
        float:right;
        color: rgb(219, 104, 28);
        cursor:pointer;
        }

插件代码

dayClick: function (date, allDay, jsEvent, view) {
                   $('#fullCalendar').fullCalendar('changeView', 'agendaDay').fullCalendar('gotoDate', date.getFullYear(), date.getMonth(), date.getDate());
               },
eventRender: function (event, element, view) {
                element.qtip({
                   content: event.QText,

                   position: {
                       my: 'CenterBottom',
                           at:'TopCenter'

                   },
                   style: {
                       tip: 'bottomMiddle'

                   }
               });
               $(element).removeClass('MaxHght');
               if (view.name == 'month') {

                       $(element).addClass('MaxHght');
                   var year = event.start.getFullYear(), month = event.start.getMonth() + 1, date = event.start.getDate();
                   var result = year + '-' + (month < 10 ? '0' + month : month) + '-' + (date < 10 ? '0' + date : date);
                   $(element).addClass(result);
                   var ele = $('td[data-date="' + result + '"]'),count=$('.' + result).length;
                   $(ele).find('.viewMore').remove();
                   if ( count> 3) {
                       $('.' + result + ':gt(2)').remove();                          
                       $(ele).find('.fc-day-number').after('<a class="viewMore"> More</a>');

                   } 
               }

           },
           eventAfterAllRender: function (view) {
               if (view.name == 'month') {
                   $('td.fc-day').each(function () {
                       var EventCount = $('.' + $(this).attr('data-date')).length;
                       if (EventCount == 0)
                           $(this).find('.viewMore').remove();
                   });
               }
           },
于 2014-05-08T09:55:06.237 回答