ejSchedule, Drag And Drop and events

Trying to work with Drag and Drop in the scheduler.

there is a actionBegin event and the event has a cancel parameter so i was hoping i could stop the dragging of an appointment there

    actionBegin: function (args) {
        if (args.requestType == 'appointmentDrag')
        {
            var id = args.appointment.Id;
            args.cancel=true;
                }
    },
but this causes the appointment to show at a different place on screen 

then i also looked at actionComplete and was hoping i could cancel a drag and drop move there also in case i decide the drop was incorrect

    actionComplete: function (args) {
        if (args.requestType == 'appointmentDrag')
        {
            var id = args.appointment.Id;
            args.cancel=true;
            
        }
    },

but this doesnt seem to work at all






1 Reply

NR Nevitha Ravi Syncfusion Team October 16, 2017 01:29 PM UTC

Hi Michael, 

Thank you for contacting Syncfusion Support. 

Your requirement for preventing drag action on particular appointment is possible with actionBegin event which is working fine at our end. You can also use the dragStart event for the same purpose using which we have prepared the sample that can be viewed from the below link. 

To achieve your requirement using dragStart event, use the below code snippet. 
<Code> 
$("#Schedule1").ejSchedule({ 
                width: "100%", 
                height: "525px", 
                currentDate:new Date(2017,10,9), 
                dragStart: "onDragStart", 
                appointmentSettings: { 
                dataSource: [{Id: 1, 
                  Subject: "Music Class", 
                  StartTime: new Date("2017/11/11 06:00 AM"), 
                  EndTime: new Date("2017/11/11 07:00 AM"), 
                  Description: "Never Give up on Obstacles", 
                 },{ 
                   Id: 2, 
                   Subject: "Meeting", 
                   StartTime: new Date("2017/11/10 06:00 AM"), 
                   EndTime: new Date("2017/11/10 07:00 AM"), 
                   Description: "Status detail", 
                 }] 
                }  
            }); 
    function onDragStart(args) {  
         if (args.appointment.Id == 1) { 
             args.cancel =true; 
          }       
    }    
</Code> 

Note: In the above sample, we have prevented the dragging of an appointment with the Subject “Music Class”. 

As you have reported that the appointment shows at different location on the screen instead of getting cancelled, we suspect that you might be experiencing problem with timezone related scenario (which may place the appointment to some other timing based on the difference) or else due to the issue with draggable but couldn’t confirm it with the provided details. To proceed further on this, kindly provide us with our below requested details –  

i.                     Screenshots depicting the issue while drag start and drag drop. 
ii.                   Timezone used in your system. 
iii.                 Whether you have used any particular timescale intervals? 
iv.                 Whether you have used StartTimeZone and EndTimeZone fields and if so, kindly share the zone details assigned to the sample appointment. 

Kindly check the above provided sample and if the issue still persists, try to reproduce it in the same sample and revert back to us which will be helpful to proceed further on this. 

Regards, 
Nevitha 


Loader.
Up arrow icon