Hi
Joshua Cao,
You can achieve your requirement by using the eventDragArea
property of the schedule component. By utilizing this property, you can specify
an area where dragging the schedule event is allowed. Please refer to the
attached code snippet below for a demonstration of the solution. Feel free to
try it, and let us know if you need any further assistance.
[index.html]
|
<div class="col-lg-9 control-section">
<div class="content-wrapper">
<div id="Schedule">
</div>
</div>
</div>
|
[index.ts]
|
let scheduleObj: Schedule = new Schedule({
width: '100%',
height: '650px',
views: ['Day', 'Week', 'WorkWeek', 'Month'],
selectedDate: new Date(2021, 1, 15),
eventSettings: { dataSource: data },
eventDragArea: '.content-wrapper',
eventRendered: (args: EventRenderedArgs) => applyCategoryColor(args, scheduleObj.currentView)
});
scheduleObj.appendTo('#Schedule');
|
sample: https://stackblitz.com/edit/xv7f1g-2sqk6e?file=index.ts,index.html,datasource.json
Regards,
Ashok
