Fullcalendar lädt nur Ereignis nach Ansicht geändert, dann werden Ereignisse nicht entfernt, bis Ansicht wieder geändert

Question

Ich habe Probleme auf meinem Live-Server mit Vollkalender. Es funktionierte gut auf localhost.

Grundsätzlich gilt:

, wenn die Seite geladen wird, tut es einen Ajax-Aufruf für alle Veranstaltungen in den Kalender zu laden. Wenn der Benutzer einen Standort auswählt, wird die Ajax-Anforderung zur Aktualisierung aller Ereignisse an diesem Standort zurückgesetzt. Welche es muss a) entfernen Sie die Ereignisse und b) laden Sie die neuen Ereignisse vom Server zurückgegeben.

Hier ist mein Code:

auf Seite laden:

$('#calendar').fullCalendar({ 
    fixedWeekCount: false, 
    defaultView: 'month', 
    eventRender: function(event, element) { 
     element.html(''); 

     var seats_available = (typeof counts[event.post_id] != 'undefined') ? event.seats - counts[event.post_id] : event.seats; 

     var dateString = moment(event.start).format('YYYY-MM-DD'); 
     var cal = $('#calendar').find('.fc-day-number[data-date="' + dateString + '"]').css('background-color', 'red').addClass('tooltip-here'); 
     var html = '<div><span>Course: </span><p>' + event.title + '</p><br /><span>Seats Available: </span><p>' + seats_available + '/' + event.seats + '</p><br /><span>Price: </span><p>R ' + event.cost.toCurrency(2, '.', ',') + '</p><br /><br /><div class="button"><button type="button" class="primary book-course" data-date="' + dateString + '" >Book Course</button></div></div>'; 
     Tipped.create('.tooltip-here[data-date="' + dateString + '"]', html, {position: 'bottom'}); 
     } 
    }); 

Verfahren erhalten Ereignisse:

function getEventData() { 

    $.ajax({ 
    url: EVENT.ajaxurl, // this is a variable passed through by wordpress 
    type: 'POST', 
    dataType: 'json', 
    data: { 
     action: 'get_event_data', 
     selected_location: $('#location-select').val(), 
     security: NINJA_EVNT.security 
    }, 
    success: function(res) { 
     console.log('#location-select', $('#location-select').val()); 
     console.log('response', res); 



     var events_raw = JSON.parse(res.data.posts); 
     counts = res.data.counts; 
     var events = []; 
     console.log('events', events); 
     var seats_available = (typeof counts[events_raw.post_id] != 'undefined') ? events_raw.seats - counts[events_raw.post_id] : events_raw.seats; 
     $('#calendar').fullCalendar('removeEvents'); // this isn't removing the events anymore 
     for(var i = 0; i < events_raw.length; i++) { 
      console.log('events_raw[i]', events_raw[i]); 
     var obj = { 
      post_id: events_raw[i].post_id, 
      title: events_raw[i].title, 
      start: moment(events_raw[i].start_date).toDate(), 
      seats: events_raw[i].seats, 
      seats_available: seats_available, 
      description: events_raw[i].description, 
      cost: events_raw[i].cost, 
      eventMouseover : function(data, event, view) { 
       var content = '<span class="hint--bottom"><h3>'+events_raw[i].title+'</h3>' + 
        '<p><b>Start:</b> '+moment(events_raw[i].start_date).toDate()+'</p>' + 
        '<p><b>Seats:</b> '+ seats_available +'/' + events_raw[i].seats + '</p>' + 
        '<p><b>Description</b> '+events_raw[i].description+ '</p></span>'; 

       tooltip.set({ 
        'content.text': content 
       }) 
       .reposition(event).show(event); 
      } 
     }; 
     events.push(obj); 
     console.log('obj', obj); 
     $('#calendar').fullCalendar('renderEvent', obj, true); // this adds the new events just fine 
     } 



    }, 
    error: function(error) { 
     console.log('error', error); 
    } 
    }); 
} 

UPDATE: hinzufügen Passwort zu, wenn ich die Ereignisse und die nachladen Ereignisse werden nicht entfernt, wenn ich in den nächsten Monat und zurück gehe, lädt es gut.

Answer 1

Ich erkannte, dass dies nur ein Latenzproblem war. Ein Lade-Overlay zu laden, bis es richtig geladen und das Drop-Down gefüllt hatte, funktionierte gut.