CODEWITHSUNDEEP
fullcalendarfullcalendar-4drop
Zazer Lin
Zazer Lin

Reputation: 11

FullCalendar V4 How to set attribute of calendar event after drop

I'm using FullCalendar V4 callback function drop. I try to pass myID which are generated by server to be Calendar event.id, but I do not know how to do. The following is simple code

var calendar = new Calendar(calendarEl, {   
    drop: function( dropInfo  ) {
        $.getJSON( url, myParams, function( data ) {
            // try to set data.myID to FullCalendar event id
            calendarEvent = { id : data.myID  };
        });
    },
    eventClick: function( eventClickInfo ) {
        var msg = "Are you sure to delete[" + event.title + "]?";
        if ( confirm(msg) ) {
            // It fails, because I can't get event.id
            var params = { method: "deleteEvent", id: event.id };
            $.get(url, params, function( data ){
                eventClickInfo.event.remove();
            });
        }
    }
});

I have tried to putcalendar.refetchEvents(); into the drop: $.getJSON(function(){}) response block, but FullCalendar makes 2 event in UI. One has balnk attribute, the other has right attribute. If I can eliminate the redundancy, it will be a good solution.

Upvotes: 0

Views: 573

Answers (1)

Zazer Lin
Zazer Lin

Reputation: 11

Thanks for ADyson's suggestion. Finally, I used callback function eventReceive solving the problem. The following is my simple code

var calendar = new Calendar(calendarEl, {   
    eventReceive: function( info ) {
        var $draggedEl = $( info.draggedEl );
        var params = { method: "insert" };
        $.ajaxSetup({ cache: false, async: false});
        $.getJSON( myURL, params, function( data ){ // insert information into DB
            info.event.setProp( "id", data.id );
        });
    },
    eventClick: function( info ) {
        var event = info.event;
        var msg = "Are you sure to delete[" + event.title + "]?";
        if ( confirm(msg) ) {
            var params = { method: "deleteEvent", id: event._def.id };
            $.get( myURL, params, function( data ){
                event.remove();
            });
        }
    },
});

Upvotes: 1

Related Questions