javascript - refetchevents - fullcalendar remove all events

El método fullCalendarjs fullCalendar(''clientEvents'') devuelve eventos duplicados

Question

Estoy usando fullcalendar.io

Completo dinámicamente mi calendario, agregando eventos a través de evenSources. Como:

$(''.add-more-events'').on(''click'', function(){
    var myEventSourceUrl = // ... get the event source url somehow
    var eventSourceColor = // ... get the color for this source
    var eventSource = {
        type: ''GET'',
        url: myEventSourceUrl,
        color: eventSourceColor
    };
    $(''.my-calendar'').fullCalendar(''addEventSource'', eventSource);
}

Asimismo, dinámicamente un populate mi calendario, eliminando eventos a través de eventSource. Como:

$(''.remove-some-events'').on(''click'', function(){
    var myEventSourceUrl = // ... get the event source url somehow
    var eventSourceColor = // ... get the color for this source
    var eventSource = {
        type: ''GET'',
        url: myEventSourceUrl,
        color: eventSourceColor
    };
    $(''.my-calendar'').fullCalendar(''removeEventSource'', eventSource);
}

Hasta ahora, todo bien: visualmente, los eventos aparecen en el calendario (poblados) y desaparecen en el calendario (despoblados) como se esperaba. Es decir, cada vez que hago clic en el botón correspondiente.

En algún momento, quiero reiniciar mi calendario y volver a mostrar los eventos que estuvieron presentes por última vez en mi calendario (mantenga el último evento Fuentes supuestamente).

El seudo código se vería así:

1. Back up my events
2. Destroy my calendar
3. Create & initialize new calendar
4. Add the backed up events (see step 1) to the new calendar

Así que implementé lo anterior como:

var clientEvents = $(''.my-calendar'').fullCalendar(''clientEvents''); /* [1] */
$(''.my-calendar'').fullCalendar(''destroy''); /* [2] */
$(''.my-calendar'').fullCalendar(calendarOptions); /* [3] */
var arrayLengthClientEvents = clientEvents.length;
for (var i = 0; i < arrayLengthClientEvents; i++) {
    $(''.my-calendar'').fullCalendar( ''addEventSource'', clientEvents[i].source);  /* [4] */
}

Pero por alguna razón, obtengo eventos duplicados cuando llamo $(''.my-calendar'').fullCalendar(''clientEvents'') .

Nota: parece estar sucediendo al cambiar de semana, aunque no estoy seguro de esto, puede no estar relacionado.

Recursos:

• Al usar jquery fullCalendar, ¿Por qué veo eventos duplicados después de cambiar meses?
• http://fullcalendar.io/docs/event_data/Event_Source_Object/
• http://fullcalendar.io/docs/event_data/removeEventSource/
• http://fullcalendar.io/docs/event_data/clientEvents/
• filtrar eventos con el método clientEvents en fullCalendar
• Calendario completo de JQuery: edita la vista de calendario después de la inicialización

Answer 1

clienteEventos

Recupera los eventos que FullCalendar tiene en la memoria.
.fullCalendar( ''clientEvents'' [, idOrFilter ] ) -> Array

Entonces devuelve una variedad de eventos.

Usted lo almacena, recrea el FC y luego agrega el origen de cada evento. Pero las fuentes son URL y lo mismo para muchos eventos , por lo que obtienes duplicados.

Básicamente lo estás haciendo

$(''.my-calendar'').fullCalendar(''addEventSource'', {url:"/myfeed"});
$(''.my-calendar'').fullCalendar(''addEventSource'', {url:"/myfeed"});

que te dará duplicados.

Entonces, para solucionarlo, puede buscar duplicados y no agregarlos. Agregue el método a continuación:

var filterOutDuplicateEventSources = function(allEventSources){
    var hash = {};
    var remainingEventSources = [];
    var arrayLength = allEventSources.length;
    for (var i = 0; arrayLength !== 0 && i < arrayLength; i++) {
        var currentEventSource = allEventSources[i];
        var currentEventSourceUrl = currentEventSource.url;
        if(currentEventSourceUrl){
            if(hash[currentEventSourceUrl] === 1){
                continue; //skip this event source, we''ve already added it
            }else{
                hash[currentEventSourceUrl] = 1; // remember that we add this currentEventSourceUrl
                remainingEventSources.push(currentEventSource);
            }
        }else{
            //handle non-url event sources
        }
    }
    return remainingEventSources;
}

Use este método tal como:

// Get all event sources
var allEventSources = [];
var arrayLengthClientEvents = clientEvents.length;
for (var i = 0; i < arrayLengthClientEvents; i++) {
    allEventSources.push( clientEvents[i].source );
}

// Filter out duplicated event sources
var remainingEventSources = filterOutDuplicateEventSources( allEventSources );

Alternativamente

Técnicamente, no creo que clientEvents esté destinado a ser utilizado de esa manera. Lo que realmente necesitas es un método eventSources . Pero no existe (podría ser una buena solicitud de función ).

Probablemente intentaría almacenar el estado del evento del calendario fuera de fullcalendar. Dijiste que tienes botones que encienden y apagan las cosas, ¿se trata básicamente de botones? ¿Es posible determinar el estado simplemente consultando sus diversos controles? Algo en ese sentido podría ser una mejor solución. Tal vez.