How to prevent the events being drag and dropped from one resource to another in JavaScript Scheduler?
This knowledge base article explains the way to prevent the event being drag and dropped from one resources to another.
Step 1: Create a JavaScript application with Scheduler by referring the following user guide link.
https://ej2.syncfusion.com/javascript/documentation/schedule/getting-started/?no-cache=1
Step 2: Within client event dragStop, event being drag and dropped from one resources to another is prevented as shown in the following code example.
var scheduleObj = new ej.schedule.Schedule({
width: '100%',
height: '650px',
dragStop: function (args) {
if (args.event.element.dataset.groupIndex !== args.event.target.dataset.groupIndex) {
args.cancel = true;
}
},
group: {
resources: ['Owners']
},
resources: [{
field: 'OwnerId', title: 'Assignee',
name: 'Owners', allowMultiple: true,
dataSource: [
{ text: 'Alice', id: 1, color: '#df5286' },
{ text: 'Smith', id: 2, color: '#7fa900' }
],
textField: 'text', idField: 'id', colorField: 'color'
}],
selectedDate: new Date(2018, 3, 1),
eventSettings: { dataSource: data },
});
scheduleObj.appendTo('#Schedule');
Step 3: Run the sample, event can be drag and dropped with in Alice resource but not from Alice to Smith resource as shown below.
Figure 1: Initial rendering of Scheduler.
Figure 2: Drag and drop enabled only with in Alice resource.
Please refer the example from the following GitHub link.
Example – Drag_drop_only_within_resource
