Category / Section
How to limit the appointments per slot?
1 min read
The following steps shows the way to limit the appointments per slot.
Step 1: Create a scheduler default sample and bind the beforeAppointmentCreate event as shown below
$("#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"
},
beforeAppointmentCreate: "OnBeforeAppointmentCreate"
});
Step2: Define the beforeAppointmentCreate event function OnBeforeAppointmentCreate as shown below, where the rendering of more than one appointments in the same slot will be prevented.
function OnBeforeAppointmentCreate(args) { // this function will be called while saving an appointment
var schObj = $("#Schedule1").ejSchedule('instance');
if (ej.isNullOrUndefined(args.appointment[0]))
obj = args.appointment;
else
obj = args.appointment[0];
var predicate = ej.Predicate(schObj._appointmentSettings["startTime"], ej.FilterOperators.lessThanOrEqual, new Date(obj.StartTime)).and(schObj._appointmentSettings["endTime"], ej.FilterOperators.greaterThanOrEqual, new Date(new Date(obj.EndTime)));
// if newly rendered appointment range has another appointment it will be retrieved here
var newAppList = new ej.DataManager(schObj._processed).executeLocal(new ej.Query().where(predicate));
if (newAppList.length > 0) // 0 indicates no more appointment should render in the same time range
args.cancel = true;
}
Sample: https://jsplayground.syncfusion.com/fxcjy1mv
Step3: Run the above sample and no two appointments can be rendered in the same time range.
Figure 1: Adding second appointment in another appointment range.
Figure 2: Second appointment is not rendered, due to the presence of existing appointment in that time cell.
