6

I added bootstrap popovers to the calendar events which open on click:

eventClick: (event, jsEvent, view) ->
  if event.ajaxUrl?
    elem = jQuery(@)
    elem.popover('destroy')

    jQuery.ajax({url: event.ajaxUrl})
    .done (result) ->
      elem.popover(
        placement: 'top'
        html: true
        trigger: 'manual'
        title: moment(event.start).format('dddd, DD. MMMM YYYY - HH:mm')
        content: result
        container: 'body')

      elem.popover('show')

My problem is, that these popovers stay open when I change the calendar view (e.g. change the month or to week/day layout). As the popovers are bound to the .fc-event divs/spans within the calendar, I need to access these DOM elements to run .popover('destroy').

Whenever a fullCalendar view is changed, the old DOM-Elements are replaced with the ones for the new view, so I would have to access them before the view is actually changed. Unfortunately there are only callbacks for event loading (loading which happens after the view is changed) and viewDisplay (same, but you get the new view).

To make sure I understood viewDisplay correctly, I added a small test to the calendar which always gives me "0" (the data-selector comes from jquery data selector)

viewDisplay: (view) ->
    alert(jQuery('.fc-event:data(popover)').size())

Is there a way to hook into the calendar process everytime the view is to be changed - but before the view is actually changed?

Edit

For now I'm simply destroying the popovers once the mouse is moved over any calendar button (as a bind to click would be executed after the view change), but this solution is just a workaround

jQuery('.fc-button').on 'mouseover', () ->
    jQuery('.fc-event:data(popover)').popover('destroy')

2 Answers 2

10

V3

I think you are looking for http://fullcalendar.io/docs/display/viewRender/

From doc

viewRender

Triggered when a new date-range is rendered, or when the view type switches. function( view, element ) view is the View Object for the new view. element is a jQuery element for the container of the new view.

This callback will get triggered when the user changes the view, or when any of the date navigation methods are called.

This callback will trigger after the view has been fully rendered, but, before events have been rendered (see also: eventAfterAllRender).

UPDATE

V4 renamed from viewRender to datesRender https://fullcalendar.io/docs/v4/datesRender

V5 renamed from datesRender to datesSet https://fullcalendar.io/docs/datesSet

2
  • I think I looked into viewRender and there was a problem with it, but it's quite some time ago. I'll see if it solves it and if so accept your answer.
    – stex
    Jul 2, 2015 at 19:47
  • in v5 you want fullcalendar.io/docs/datesSet Sep 23, 2020 at 16:01
3

In V4, viewRender was deprecated, check out the release notes, now they have:

"viewSkeletonRender" callback which is triggered when the new view is mounted, it receives a view object containing a lot of good stuff in it.

"viewSkeletonDestroy" callback which is triggered right before the old view is about to get unmounted.

--

Alternatively, thought may not answer the question directly, you can use the "datesRender" callback. I needed was to run a function when previous, next, or the view changed. (I had to compute the total number of hours of an event type based on the date range and the views)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.