CODEWITHSUNDEEP
javascriptjqueryfullcalendarfullcalendar-5
scrz
scrz

Reputation: 71

Is there any method in Fullcalendar v5 which rerenders event?

I have bootstrap popover initialized on events, inside popover content i have button (on click button calls function which changes the extendedProp.status of related event using event.setExtendedProp() method)

//above of my code FullCalendar has rendered and set as variable var = calendar


 eventDidMount: function (info) {

        $(info.el).popover({
            html: true,
            content: PopoverHtml(info.event),
            container: 'body',
            animation: true,
        })
}

Since popover is initialized right after the event element has been added to the DOM i need to rerender event to change popover's content

   eventChange: function (changeInfo) {
        event_source = calendar.getEventSourceById(changeInfo.event.id);
        event_source.refetch();
    },

I also tried dynamic content setting method of bootstrap setContent()

Upvotes: 1

Views: 1779

Answers (1)

mkours
mkours

Reputation: 510

I use popover with eventClick without problems:

         function event_click(info) {
                $('.popover_show').popover('dispose'); 
                $(info.jsEvent.srcElement).popover({
                    container: 'body',
                    animation: false,
                    title: 'Zeitraum: '+fc_date_print(info.event.start, true)+" - "+fc_date_print(info.event.end, false)+
                    "<a href='#' class='float-right' onclick='form_cancel()' ><img src='/icon/x.svg' width='23' height='23' > </a>",
                    placement: 'bottom',
                    boundary: 'window',
                    sanitize: false,
                    trigger : 'manual',
                    popperConfig: {eventsEnabled: false },
                    "html": true,
                    content: function(){ a = get_form(info.event.extendedProps['id']); return a; }
                });
                $(info.jsEvent.srcElement).popover('show'); 
                $(info.jsEvent.srcElement).addClass('popover_show');
          }

I create the popover-content dynamicly in get_form() (currently in 2 way, one by javascript from extentedProbs, second I load content from popover dynamicly via ajax. This is much more efficent, than creating a popover for every event in advance. Works fine for me.

The line

            $(info.jsEvent.srcElement).popover('show');

do the magic, that you don't need a second click.

I add the class popover_show to the sourceElement, so $('.popover_show').popover('dispose'); will close all popover. (I do that before open a new popover) But there are plenty other ways for that.

Upvotes: 3

Related Questions