При добавлении событий в FullCalendar они дублируются - делается несколько вызовов, чтобы добавить событие без причины

Question

Я использую FullCallendar и Jquery. Я сделал интерфейс, похожий на календарь Google, и извлек события из файла json. Когда пользователь нажимает на день, открывается div для ввода информации о событии click click и событие добавляется. При втором щелчке, когда пользователь нажимает добавить событие, добавляются два события: одно в первый день, по которому щелкнули, и второе в выбранный день. На третий клик добавляются 3 события и так далее. Вот код: var c = 0;

function cleanEventBubble(){
    $('#event').hide();
    $('td').removeClass('selDay');
    $('#eventDate').text('');
    $('#calEvent,input:text').val('');
}

function createEvent(date, allDay, jsEvent, View, selCell){
    //Clean the event bubble and calendar
    cleanEventBubble();
    $(selCell).addClass('selDay');
    $('#eventDate').append(date.toDateString());
    $('#event').css('left', jsEvent.pageX);
    $('#event').css('top', jsEvent.pageY);
    $('#event').show();

    $('#btnAddEvent').click(function(){addEvent(date, $('#title').val(), c)});
}

function addEvent(date, title, id){
    $.ajax({
            type:'get',
    <cfoutput>url:  '#strURL#'</cfoutput>,
            data:{
                method:'addEvent',
                user:1,
                title:title,
                allDay:'true',
                start:$.fullCalendar.formatDate( date, 'yyyy-MM-dd' )
                },
            dataType:   'json',
            success: function(data, status){alert('response: ' + data);},
            error: function(data){$('#returnMess').html(data);}

    });
    $('#calendar').fullCalendar( 'refetchEvents' )
    cleanEventBubble();
}

/**/
function removeEvent(id){
    $('#calendar').fullCalendar('removeEvents', id);
}

function updateEvent(id, title){
    var event = $('#calendar').fullCalendar('clientEvents', id);
    event.title = title;
    $('#calendar').fullCalendar('updateEvent', event);
}


$(document).ready(function() {
    //Create JQuery connection to obj
    $('#event').hide();
    //Make event bubble draggable
    $('#event').draggable();

    $('#evBubbleClose').click(cleanEventBubble);
    // page is now ready, initialize the calendar...
    $('#calendar').fullCalendar({
        // put your options and callbacks here date, allDay, jsEvent, view
        dayClick:function(date, allDay, jsEvent, view){
           createEvent(date, allDay, jsEvent, view, this);
        },
        <cfoutput>events: '#strURL#'+'?wsdl&method=getEvents'</cfoutput> ,
        theme: true,
        header: {left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, 
        editable:true
    });

    //$('#calendar').fullCalendar('renderEvents');

});

Answer 1

ОК, вот решение без логических флагов:)

Вместо $(this).remove();

использование

$('#calendar').fullCalendar( 'removeEvents', event.id );

См. Документацию

Answer 2

Это потому, что у вас есть два события щелчка, которые создают события?(Я не уверен, где находится ваша «кнопка»)

Первое 'событие добавления' вызывается на dayClick:

  dayClick:function(date, allDay, jsEvent, view){
           createEvent(date, allDay, jsEvent, view, this);
        },

Так второе событие создается, когда кнопка addEventнажал?

$('#btnAddEvent').click(function(){addEvent(date, $('#title').val(), c)});

Попробуйте только использовать dayClick, чтобы добавить события и посмотреть, работает ли это должным образом, а затем перейти оттуда.