Удалить прошлые даты и следующие месяцы с текущего месяца

Ответ 1

Вы можете попробовать пропустить события в методе eventRender():

eventRender: function(event, element, view)
{
   if(event.start.getMonth() !== view.start.getMonth()) { return false; }
}

Ответ 2

Ячейки сетки для следующего и предыдущего месяца имеют класс "fc-other-month", поэтому вы можете настроить таргетинг таким образом:

например.: Скрыть числа дня, добавьте CSS:

.fc-other-month .fc-day-number { display:none;}

или запустите этот JavaScript:

$(".fc-other-month .fc-day-number").hide()

Ответ 3

Попробуйте это!

$('.fc-other-month').html('');

Это работает для меня!

Ответ 4

Добавьте этот параметр showNonCurrentDates: false. При этом значении даты и события, не относящиеся к текущему месяцу, не будут отображаться.

$('#calendarId').fullCalendar({
     // Other settings
     showNonCurrentDates: false            
});

Ответ 5

Ни одно из решений, предоставленных в этом ответе, не решит проблему с текущей версией FullCalendar. Используя Bascht ответ в качестве отправной точки, я обновил его подход, чтобы использовать текущие API FullCalendar. Ниже приведен пример рабочего кода, который выполнит эту задачу:

eventRender: function (event, element) {
    var eventDate = event.start;
    var calendarDate = $('#activitiesCalendar').fullCalendar('getDate');
    if (eventDate.get('month') !== calendarDate.get('month')) {
        return false;
    }
}

Ответ 6

eventRender: function (event, element, view) {
    var currentMon = new Date(event.start);
    var currentMonth = currentMon.getMonth();

    var currentMonViewStart = new Date(view.start);
    var currentMonthViewStart = currentMon.getMonth();

    var currentMonViewEnd = new Date(view.end);
    var currentMonthViewEnd = currentMonViewEnd.getMonth();

    if((currentMonth == currentMonthViewStart) && (currentMonth  == currentMonthViewEnd)){ 
        return false; 
    }
}

Ответ 7

для версии 2.0 или выше:

eventRender: function (event, element, view) {
   if(event.start._d.getMonth() !== $('calendar').fullCalendar('getDate')._d.getMonth()) { 
      return false; 
    }
}

// if you want to remove other month days from view add to css:
    .fcc-other-month { 
        visibility:hidden;
     }

Ответ 8

Попробуйте использовать weekMode: http://fullcalendar.io/docs/display/weekMode/.

weekMode: 'liquid', or `weekMode: 'variable',`

Надеюсь, что это поможет

Ответ 9

Для более новой версии плагина FullCalendar используются следующие вспомогательные функции Moment.js:

eventRender: function(event, element, view){ var evStart = moment(view.intervalStart).subtract(1, 'days'); var evEnd = moment(view.intervalEnd).subtract(1, 'days'); if (!event.start.isAfter(evStart) || event.start.isAfter(evEnd)) { return false; } },

Ответ 10

$('.fc-other-month').html('');

и для отключения другого месяца:

$(".fc-other-month").addClass('fc-state-disabled');

Ответ 11

В последней версии я использовал:

eventRender: function(event,element,view) {
    var view_title = view.title;
    var event_title = event.start;
    var event_title2 = moment(event_title).format('MMMM YYYY');
    if(event_title2 !== view_title) { 
        return false; 
    } else {
        var idname = 'event' + event.id;
        $(element).attr('id', idname).addClass('ttLT').attr('title', event.title);
        var mytitle = event.title;                              
        if (mytitle.toLowerCase().indexOf("open timeslot") >= 0)
        {
            $(element).addClass('alert').addClass('alert-success');
        }
        else{
            $(element).addClass('alert').addClass('alert-info');
            $(element).find('.fc-event-title').addClass('capitalize');
            $(element).find('.fc-event-inner').addClass('capitalize');                                                                                                                              
        }                                               
        element.qtip({
            content: event.description,
            style:{classes:'qtip-bootstrap'},
            position:{my:'bottom right',at:'top left'}
        });
    }
}   

Ответ 12

Использование рендеринга событий и функции обратного вызова решает мою проблему. Прекрасное скрытие событий предыдущего и следующего месяца из текущего представления

eventRender: function(event, element, view) {
                        if (view.name == "month") {
                            if (event.start._i.split("-")[1] != getMonthFromString(view.title.split(" ")[0])) {
                                return false;
                            }
                        }
                    }

function getMonthFromString(mon) {
            var d = Date.parse(mon + "1, 2016");
            if (!isNaN(d))
                return new Date(d).getMonth() + 1;
            return -1;
        }

Надеюсь, что это поможет

Ответ 13

Это работает для меня на версии 3.6.1

 eventRender: function(event, element, view)
 {
     if(!event.start.isBetween(view.intervalStart, view.intervalEnd)) { return false; }
 }

Ответ 14

вы можете попробовать этот клиентОпции 'showNonCurrentDates' => false, and 'fixedWeekCount' => false,

Этот код позволяет мне скрыть дни предыдущих месяцев и следующих месяцев, но ячейки тёмных дней остаются: Попробуйте использовать Fullcalendar Doc

<?= $JSCode = <<<EOF
function(event, element, view) {

if(event.nonstandard.status =='0'){
 element.find(".fc-title").css({"color": "red"});   
 $('.fc-day-top[data-date="'+event.nonstandard.date+'"]').find('.fc-day-number').css({"background-color": "red", "color": "white"});                   
} else if(event.nonstandard.status == '1'){
   element.find(".fc-title").css({"color": "#1ab394"});                      
  $('.fc-day-top[data-date="'+event.nonstandard.date+'"]').find('.fc-day-number').css({"background-color": "#1ab394", "color": "white"});                     
}else if(event.nonstandard.status == '4' || event.nonstandard.status == '5'){
   $('.fc-day-top[data-date="'+event.nonstandard.date+'"]').find('.fc-day-number').css({"background-color": "#676a6c", "color": "white"});                                          
}else if(event.nonstandard.status == '3'){
 element.find(".fc-title").css({"color": "red"}); 
 $('.fc-day-top[data-date="'+event.nonstandard.date+'"]').find('.fc-day-number').css({"background-color": "red", "color": "white"});                        
}else if(event.nonstandard.status == '2'){
    element.find(".fc-title").css({"color": "orange"}); 
 $('.fc-day-top[data-date="'+event.nonstandard.date+'"]').find('.fc-day-number').css({"background-color": "orange", "color": "white"});                        
}                           

if(event.nonstandard.working_hours) { 
    var new_description =  '<strong>Total' + '    : </strong>' + event.nonstandard.working_hours + '<br/>';
    element.append(new_description);  
} } EOF;


        yii2fullcalendar\yii2fullcalendar::widget([
            'id' => 'calendar',
            'options' => [
                'lang' => 'en',
                'header' => [
                    'left' => 'prev,next today',
                    'center' => 'title',
                    'right' => 'month,agendaWeek,agendaDay'
                ],
            ],
            'clientOptions' => [
                'height' => 750,
                'showNonCurrentDates' => false,
                'language' => 'en',
                'eventLimit' => true,
                'selectable' => true,
                'selectHelper' => true,
                'droppable' => false,
                'editable' => false,
                'fixedWeekCount' => false,
                'defaultDate' => date('Y-m-d'),
                'eventRender' => new JsExpression($JSCode),
            ],
            'events' => Url::to(['/user/myattr/jsoncalendar'])
        ]);
        ?>

Ответ 15

Используйте этот трюк, чтобы удалить события прошлых и дат следующих месяцев из текущего месяца в году.

eventAfterAllRender: function() {
                            $(".fc-other-month").each(function() {
                                var index=$(this).index();
                                var aa= $(this).closest("table").find("tbody").find("tr").
                                find("td:nth-child("+(index+1)+")");
                                aa.find(".fc-day-grid-event").hide();

                            });
                        },