Prevent Other Month Events From Rendering in jQuery FullCalendar

I'd like to prohibit fullcalendar from displaying events in the other month cells. I figured I could do this with the eventRender event.

$('#calendar').fullCalendar({
    events: $.fullCalendar.myFeed(),
    eventRender: function (event, element) {
        if (event.start.getMonth() != ????)
            $(element).hide();
   }
});

I can't figure out what to replace the ???? to get 开发者_运维问答the calendar's current month. Anybody have some tips?

I guess there isn't a way to reference the parent calendar from within this event. "this" refers to the event object. I didn't realize that the view also gets passed as a third parameter. I was able to accomplish this using the following code:

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

If you use a fullcalendar with year view (https://github.com/tpruvot/fullcalendar). You cannot use view.start.getMonth() on year view. I used a little trick passing through eventAfterRender :

eventAfterRender: function (event, element, view) {
    var col=element.closest('td').index()+1;
    var $cellh=element.closest('table').find('thead td:nth-child('+col+')');
    if ($cellh.hasClass('fc-other-month') == true)
            element.css('visibility','hidden')
},

You can do it with some custom style

.fc-other-month {
    background: white !important;
}

.fc-row .fc-bg {
    z-index: 5;
    pointer-events: none;
}

The solution here: using day of fc-other-month over the day of curent-month with background white.

eventRender: function(event, element) {

  var view = $('#calendar').fullCalendar('getView');
  if (event.start.month() == view.intervalStart.month()) {
    element.addClass("bg-blue");
  }
},