Articles in this section
Category / Section

How to customize the start/end time interval in cloned appointments while dragging and resizing

1 min read

The following steps shows the way to customize the start and end time displayed in the cloned appointment element while dragging and resizing the appointments.

Step 1:  Create a scheduler default sample and bind the drag and resize event as shown below,  

JavaScript

$(function () {
            var dManager = ej.DataManager(window.Default).executeLocal(ej.Query().take(10));
            $("#Schedule1").ejSchedule({
                width: "100%",
                height: "525px",
                currentDate: new Date(2014, 4, 5),
                appointmentSettings: {
                    dataSource: dManager,
                    id: "Id",
                    subject: "Subject",
                    startTime: "StartTime",
                    endTime: "EndTime",
                    description: "Description",
                    allDay: "AllDay",
                    recurrence: "Recurrence",
                    recurrenceRule: "RecurrenceRule"
                },
                drag: "cusInterval",
                resize: "cusInterval"
            });
        });

 

Step 2: Define the drag and resize event function onDrag and onResize respectively which contains the code to customize the time duration. The following code example shows the logic.

function cusInterval(args) {
            args.interval = 15; // here customized minutes can be set
        }

 

Sample Link: https://jsplayground.syncfusion.com/ldfzq3xt

 

Step 3: Run the above sample and the appointment time is customized in the interval of time scale value as shown below.

Scheduler with customized time while dragging

Figure 1: Scheduler with customized time while dragging.

Scheduler with customized time while resizing

Figure2: Scheduler with customized time while resizing.

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments
Please sign in to leave a comment
Access denied
Access denied