Как удалить это событие из FullCalendar?

Календарь позволяет пользователю перетаскивать временной интервал в календарь, однако я бы хотел, чтобы они могли удалить его, если они нажмут на него.

Итак, в eventClick у меня есть эта функция:

function (calEvent) {
  removeRequestedEvent($(this), calEvent);
},

Он просто передает событие календаря и сам календарь.

removeRequestedBooking: function (cal, calEvent) {
    if (!confirm("Delete?"))
        return;

    cal.fullCalendar("removeEvents", calEvent.id);
    cal.fullCalendar("rerenderEvents");

    // Re-show draggable element
    $("#requests #" + calEvent.id).show();
}

Я также пробовал использовать фильтр, но точка останова в операторе return никогда не попадала.

    cal.fullCalendar("removeEvents", function (event) {
        return event.id == calEvent.Id;
    });

Любые идеи? (Я знаю, что Id прав, и работает последняя строка). Firebug не показывает никаких ошибок в javascript.

Я использую FullCalendar v1.4.10

Ответ 1

Вместо использования вашего переданного в cal, можете ли вы попытаться использовать вызов в div, который содержит ваш календарь?

В случае eventClick, this относится к HTML для события в соответствии с тем, что я читаю в документах.

Ответ 2

Когда у вас есть все свои идентификаторы, используйте решение Tuan.

Но когда у вас нет идентификатора в вашем случае, сделайте это так (эта работа также, когда у вас установлен идентификатор):

eventClick: function(event){
   $('#myCalendar').fullCalendar('removeEvents',event._id);
}

Почему эта проблема возникает? Общей причиной этого является fullcalendar, который не добавляет идентификатор автоматически при добавлении нового события. Если это так, идентификатор, который вы прошли, undefined. Fullcalendar использует id в обоих случаях, когда вы пытаетесь удалить с помощью id или filter. Поэтому, когда значение равно undefined, оно всегда возвращает false. Значение списка удаляемых элементов всегда пусто.

Ответ 3

Еще проще:

eventClick: function(calEvent, jsEvent, view) {
    $('#calendar').fullCalendar('removeEvents', function (event) {
        return event == calEvent;
    });
}

Ответ 4

Использовать refetchEvents:

cal.fullCalendar("refetchEvents");

Ответ 5

Ответ Justkt занял у меня секунду, чтобы обернуть мою голову, но я опубликую свои результаты для других нубов, которым нужно увидеть код очень простым способом:

eventClick: function(event){
  var event_id = event.id;
  $.post('/Dropbox/finance/index.php/welcome/update', {"event_id": event_id},
      function(data){
          $('#calendar').fullCalendar("removeEvents",  (data));
          $('#calendar').fullCalendar("rerenderEvents");                
        }
      });   
}

PHP (с использованием codeignighter):

public function update(){
  $result = $this->input->post('event_id');
  echo $result;
  // would send result to the model for removal from DB, or whatever
}

Ответ 6

Я использую функцию фильтра с event.start и хорошо работает

calendar.fullCalendar('removeEvents', function(event) {
  return 
    $.fullCalendar.formatDate(event.start, 'yyyyMMdd') 
    == $.fullCalendar.formatDate(start, 'yyyyMMdd');
});