2015-01-27 4 views
2

Мой fullcalendar визуально дублирует события, когда я перетаскиваю их на другой временной интервал. Я упростил свой код до eventDrop, чтобы изолировать проблему, и все же я не могу понять проблему. Если я храню события в своем локальном хранилище, я не получаю дубликат в хранилище, и дубликат исчезает при перезагрузке страницы. Это означает, что проблема только визуальная и с полным календарем. Однако это, безусловно, огромная проблема, поскольку я не хочу перезагружать страницу: я хочу оставаться в текущем представлении, изменяя то, что мне нужно.Fullcalendar дублирует событие при перетаскивании

Вот мой код eventDrop:

eventDrop: function(event, delta, revertFunc, jsEvent, ui, view) { 
      if (!confirm("Are you sure you want to change " + event.title + " ?")) { 
        /*If the user cancels the change, the event returns to its original position. Otherwise it saves the event.*/ 

        revertFunc();  /*Revert changes using the predefined function revertFunc of fullCalendar.*/ 

        $("#calendar").fullCalendar("refetchEvents"); 
        /*FullCalendar Method to refetch events from all sources and rerender them on the screen.*/ 

       } else { 

        updateConfirm(event);  /*Use the logic to confirm the event update properties*/ 

        Evento.prototype.Update(event);  /*Modify the targeted event on the localStorage using the Update method of the Evento Class*/ 

        $("#calendar").fullCalendar("updateEvent", event); 
        /*FullCalendar Method to report changes to an event and render them on the calendar.*/ 

        $("#calendar").fullCalendar("refetchEvents"); 
        /*FullCalendar Method to refetch events from all sources and rerender them on the screen.*/ 

       } 
      } 

А вот GIF выпуска: https://i.imgur.com/rFPvvjE.gif

UPDATE: С помощью slicedtoad, я изолирован вопрос к моей updateConfirm логике:

var updateConfirm = function(event) { 
    if (confirm("New title?")) { /*Check if the user wants to change the event title*/ 
     event.title = prompt("Enter the new title: "); /*Set new title for the event*/ 
    } else { 
     event.title = event.title; 
    } 

    if (confirm("New description?")) { /*Check if the user wants to change the event description*/ 
     event.description = prompt("Enter the new description: "); /*Set new description for the event*/ 
    } else { 
     event.description = event.description; 
    } 

    if (confirm("Is the event important?")) { /*Check if the user wants to change the event priority*/ 
     event.overlap = false; 
     event.backgroundColor = "red"; /*Set new priority for the event*/ 
    } else { 
     event.overlap = true; 
     event.backgroundColor = "blue"; /*Set new priority for the event*/ 
    } 
}; 

ОБНОВЛЕНИЕ 2: console.log(event)до updateConfirm (событие):

Object {id: "2015-01-27T15:29:11+00:00", title: "título", start: m, end: m, allDay: false…}_allDay: false_end: m_id: "2015-01-27T15:29:11+00:00"_start: mallDay: falsebackgroundColor: "blue"className: Array[0]description: "gt4"end: mid: "2015-01-27T15:29:11+00:00"overlap: truesource: Objectstart: mstoringId: "2015-01-27T15:29:11+00:00"title: "título"__proto__: Object 

console.log(event)после updateConfirm (событие):

Object {id: "2015-01-27T15:29:11+00:00", title: "título", start: m, end: m, allDay: false…}_allDay: false_end: m_id: "2015-01-27T15:29:11+00:00"_start: mallDay: falsebackgroundColor: "blue"className: Array[0]description: "gt4"end: mid: "2015-01-27T15:29:11+00:00"overlap: truesource: Objectstart: mstoringId: "2015-01-27T15:29:11+00:00"title: "título"__proto__: Object 

ответ

0

Поскольку событие не из местных источников, вызывая updateEvent не является необходимым, так как событие будет refetched от база данных, когда вы звоните $("#calendar").fullCalendar("refetchEvents");

Я не совсем уверен, почему он будет дублировать, но событие, измененное updateEvent, похоже, pe risist мимо refetch. Вы должны изменить его ID или заменить его другим объектом события, но я не смог его воспроизвести.

Так попробуйте удалить обновление линию

} else { 
    updateConfirm(event); 
    Evento.prototype.Update(event); 
    $("#calendar").fullCalendar("refetchEvents"); 
} 

Если это не сработает, попробуйте удалить событие вручную:

$("#calendar").fullCalendar('removeEvents', event._id) //replace the updateEvent call with this 
//or event.id if your events have an explicit id 

Добавление

Вы, вероятно, хотите, чтобы на самом деле цифра из-за причины проблемы, поскольку вышеупомянутое просто исправляет ее. Что-то в Evento.prototype.Update updateConfirm модифицирует событие таким образом, что FC думает, что это другое событие. Является ли это копирование и замена себя? Вы играете с его идентификатором?

+0

Хм. Я смог выделить его с вашим ответом ... это моя логика updateConfirm, которая ошибочна. Я обновляю вопрос с помощью этого кода. – mesosteros

+0

@mesosteros Неправильно, так как в нем произошли плохие изменения в мероприятии? – slicedtoad

+0

UpdateConfirm просто проверяет, хочет ли пользователь изменить заголовок события, описание, если это событие allday и т. Д. Я добавил логический код. – mesosteros

Смежные вопросы