dragging and dropping date not working right in fullcalendar

Question

I am using jquery fullcalendar for my application. I am trying validate like can not drag and drop event to past date.Here is my code,

$(document).ready(function() {
        var dragfingDate;

        $('#calendar').fullCalendar({
            //defaultDate: '2015-02-12',
            editable: true,
            eventLimit: true, // allow "more" link when too many events
            events: [  here my events ],
 eventDrop : function(event,revertFunc)
            {
                //var moment = $('#calendar').fullCalendar('getDate');
                //alert("The current date of the calendar is " + moment.format("YYYY-MM-DD"));

                var dropedDate = event.start.format("YYYY-MM-DD");
                alert(dropedDate);
                var todayDate = $('#calendar').fullCalendar('getDate');
                var today_newformatDate = todayDate.format("YYYY-MM-DD");
                alert(today_newformatDate);
                if(dropedDate < today_newformatDate)
                {
                    alert("can not move previous dates.");
                    revertFunc();

                    //$('#calendar').fullCalendar('selectable', false);

                }
                else
                {
                    //alert("can move to next dates.");
                    var r = confirm("Are sure want to shift?");
                    if(r == true)
                    {
                        // here is my ajax code to updte DB
                        //alert("droped "+event.title +"on date of "+event.start.format("YYYY-MM-DD"));
                    }
                    else
                    {
                        revertFunc();
                    }

                }

            }
});

but this code not working fine.when i drag and drop first time, example 2015-04-27 to 2015-04-20 then it shows alert that "can not move previous dates." then if again drag and drop the same date to some date means then that dropped date will be different from where i dropped date(example if i drag and droped 2015-04-28 to 2015-04-15 but dropped date shows like 2015-04-20,15 or some other date).

Update : I found the problem that when called that revertfunc there showing like selectable wherever cursor moving on date.when click on calendar that selectable hold some date and assigned to recently dragged date.

why this happen and how to fix?

valar morghulis valar morghulis · Accepted Answer · 2015-04-25T08:33:50

The problem is with your eventDrop function try replacing your function with :

eventDrop: function( event, delta, revertFunc, jsEvent, ui, view ) {
    // add your logic here 
}

Note: The revertFunc is the third parameter to the eventDrop function check the docs here.

The best solution though i would like to suggest is, make a simple change in your array that you are passing to your calendar i.e editable: false, below is the code.

$('#calendar').fullCalendar({
    events: [
       {
          title  : 'event1',
          start  : '2010-01-09T12:30:00',
          end    : '2010-01-09T12:40:00',
          editable: false //set it to true if you want to make it editable
       }
    ]
});

Note: In the above case you will have to manipulate the event array you are passing to your calendar beforehand.

dragging and dropping date not working right in fullcalendar

1 Answers