FullCalendar ограничить количество событий и иметь более ссылку

Question

Я видел, что был запрос добавить ссылку БОЛЬШЕ в календарь и ограничить количество событий. Это уже сделано? Или кто-то реализовал там свою работу, которой они могут поделиться? Если да, пожалуйста, оставьте свой код.

Answer 1

С новой сборкой v2.1.0-beta2, запущенной 17 дней назад Аршоу сделал следующие

РАЗРЕШЕННЫЕ ПРОБЛЕМЫ:

• Макс. Событий сссылка «more ...» (304)
• Не запускать eventMouseover / eventMouseout при перетаскивании / изменении размера (1297)

НОВЫЕ ОПЦИИ:

• eventLimit
• eventLimitClick
• eventLimitText
• dayPopoverFormat

Источник

Итак,Вы можете сделать следующее:

$('#calendar').fullCalendar({
    lang: 'en',
    eventLimit: true, // If you set a number it will hide the itens
    eventLimitText: "Something" // Default is `more` (or "more" in the lang you pick in the option)
});

Answer 2

Я совсем недавно написал плагин, который делает именно то, что вы просите.Надеемся, что Адам Шоу, разработчик fullcalendar, будет ссылаться на него или включать этот плагин расширения в ядро ​​fullcalendar.

Проверьте это и дайте мне знать, что вы думаете.Пожалуйста, сообщайте о любых ошибках.https://github.com/lyconic/fullcalendar.viewmore

Спасибо

Answer 3

Я справляюсь с этим на eventRender.Код выглядит примерно так: maxEvents - это то, что вы хотите установить для максимума, а BuildMoreLink(currentMoreNum) создает вашу ссылку.Возврат false не позволяет элементу быть добавленным в ваш календарь.

    eventRender: function (event, element) {
        var eventDateString = GetDateInCalFormat(event.start);
        var $calDay = $('td.fc-day[data-date="' + eventDateString + '"]');
        var dayEventCount = $calDay.attr('dayEventCount') ? parseInt($calDay.attr('dayEventCount')) : 0;

        dayEventCount = dayEventCount + 1;
        $calDay.attr('dayEventCount', dayEventCount);

        if (dayEventCount <= maxEvents) {
           //[any custom formatting]
        }
        else {
            var missingEvents = dayEventCount - maxEvents;
            $('.moreLink', $calDay).remove();
            $moreLink = $('<div class="moreLink"/>')
            $moreLink.html(BuildMoreLink(missingEvents));
            $calDay.append($moreLink);
            return false;
        }
    }

О да, и вот мой форматер для получения правильного значения даты, чтобы найти день:

function GetDateInCalFormat(dateToFormat) {
    dd = dateToFormat.getDate();
    mm = dateToFormat.getMonth() + 1;
    yyyy = dateToFormat.getFullYear();
    if (dd < 10) { dd = '0' + dd }
    if (mm < 10) { mm = '0' + mm }
    results = yyyy + '-' + mm + '-' + dd;
    return results;
}

Answer 4

Если у кого-то есть такая же проблема, прочитайте это:

если PHP / MySQL используется для извлечения событий из БД:

просто получите штамп даты начала и конца месяца.

затем используйте простой цикл for

  $allEvents = array();
  for ($i = $start; $i <= $end; $i = strtotime("+ 1 day", $i)) {
     //need to have start and end dates to be the same day but end day must be at 23:59:59
     $newStart = $i;
     $newEnd = strtotime("+ 23 hours 59 minutes 59 seconds", $newStart);
     $limit = 10;
     //load all events with limit whatever limit you wish and merge with all events
     $loadedEvents = loadEvents($newStart, $newEnd, $limit, $otheroptions);
     $allEvents = array_merge($allEvents, $loadedEvents);
  }

и затем вы можете использовать массив $allEvents для отображения событий. Это сработало для меня, и каждый день отображает максимум 10 событий.

Answer 5

Похоже, что есть открытая заявка на улучшение этой функции на полной странице календаря Google Если вы отметите эту проблему, вы будете уведомлены о любых обновлениях функциональности.

Кроме того, в этой теме кто-то опубликовал попытку решения. Я не пробовал это сам, но это может стоить посмотреть. Просмотреть этот конкретный комментарий здесь .