Removing specific events with removeEvents method

Question

I've just started out using this plugin and I am having some trouble removing events that I have just created. I can delete all the events when using eventClick, but not particular ones on eventClick.

Any help would be appreciated. Here is my code.

<script type='text/javascript'>

$(document).ready(function() {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    var calendar = $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        selectable: true,
        selectHelper: true,
        select: function(start, end, allDay) {
            var title = prompt('Trade Show Name:');
            if (title) {
                calendar.fullCalendar('renderEvent',
                    {
                        title: title,
                        start: start,
                        end: end,
                        allDay: allDay,
                        id: 12
                    },
                    true // make the event "stick"
                );
            $('input[name="startDate"]').val(start);
            }
            calendar.fullCalendar('unselect');
        },
        eventClick: function(calEvent, jsEvent, view) {
            $('#calendar').fullCalendar('removeEvents', function (calEvent) {
                return true;
            });,
        editable: true
    });

});

Answer 1

You can do this in 2 ways:

1) Set a unique ID to each of your events and pass those IDs to the removeEvents call.

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

Here _id is the unique ID fullCalendar generates.

2) Pass a filter function to delete the event you want.

Considering that you are trying to do this in eventClick, I would suggest you use the 2nd. An example to your case is as follows:

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

Here the filter function passed to removeEvents accepts the event you want to delete and returns true. Since you are doing this in eventClick, all you have to do is pass calEvent.

Hope this helps!