Searching custom fields and preventing overlapping appointment

Hi there,

Here is my first question.
I have the following model to data bind with my schedule.
public class AssessmentBooking
    {
        public int Id { get; set; }
        public string Subject { get; set; }
        public string Description { get; set; }
        public DateTime StartTime { get; set; }
        public DateTime EndTime { get; set; }
        public string Categorize { get; set; }
        public string Location { get; set; }
        public int RegistrationID { get; set; }
        public int OwnerId { get; set; }
        public bool AllDay { get; set; }
        public bool Recurrence { get; set; }
        public string RecurrenceRule { get; set; }
    }

Please note that int RegistrationID is a custom field that I added.
I'm using the following javascript function to search.

function searchKeyUp(args) {
    var searchString = $("#txtSearch").val();
    var schObj = $("#ELLCalendar").data("ejSchedule");
    var result = schObj.searchAppointments(searchString);
    showResult(result, searchString);
}

I notice that "searchAppoimets function does not search custom fields. Is there a way to add custom fields to be a part of search criteria using searchAppointments?

My Second question is how do you prevent overlapping appointments?
I can think of two validation scenarios for this.
1.Client-side validation. Validation is done on Javascript and prevents users to create overlapping appoints. Is there a built-in functionality for this?
2.Server-side validation. If there are concurrent users using the schedule, validation needs to be done when attempting to save the appointment into DB.
I have a stored procedure that sends the error message when a user tries to save an appointment that overlaps with another appointment.
Once I receive this error message back from the DB, how do I undo what user tried to save and display an error message on the front end?

5 Replies

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

Hi Andrew, 

Thank you for contacting Syncfusion Support. 

Q1: Searching custom fields. 
To search the custom fields of Schedule, we need to pass the custom field name as parameter to the searchAppointments client-side public method. In the code you have shared, only search string is passed as a parameter which only searches the default fields of the Scheduler. We have prepared the sample for your reference which can be downloaded from the below location. 


<Code> 
function searchKeyUp(args) { 
            var searchString = $("#txtSearch").val(); 
            var schObj = $("#Schedule1").data("ejSchedule"); 
            var fields = ["Status", "Subject"] 
            var result = schObj.searchAppointments(searchString, fields); 
            showResult(result, searchString); 
} 
</Code> 

In the above sample, we have passed the fields “Status”(custom field) and “Subject”(default field) to the public method SearchAppointments. 
 

Q2:Preventing overlapping appointments 
There is no built-in scheduler event to prevent the overlapping of appointments. We suggest you to make use of the schedule client-side events to validate it and display alert from there. Kindly refer the below code snippet to prevent the overlapping of appointments by validating through client-side. 

<Code> 
@(Html.EJ().Schedule("Schedule1") 
        .Width("100%") 
        .Height("525px") 
        .CurrentDate(new DateTime(2017, 6, 5)) 
        .AppointmentSettings(fields => fields.Datasource(ViewBag.datasource) 
            .Id("Id") 
            .Subject("Subject") 
            .StartTime("StartTime") 
            .EndTime("EndTime") 
            .Description("Description") 
            .AllDay("AllDay") 
            .Recurrence("Recurrence") 
            .RecurrenceRule("RecurrenceRule") 
            ) 
            .ScheduleClientSideEvents(evt => 
            evt.Create("onCreate") 
            .BeforeAppointmentCreate("onValidation") 
            .BeforeAppointmentChange("onValidation") 
            .DragStop("onValidation") 
            .ResizeStop("onValidation")) 
) 
function onValidation(args) { 
            if (args.type == "beforeAppointmentChange") { 
                app = args.appointment.changed[0]; 
            } 
            else { 
                if (ej.isNullOrUndefined(args.appointment[0])) 
                    app = args.appointment; 
                else 
                    app = args.appointment[0]; 
            } 
            overlapList = this._overlapApp(app["AppTaskId"], app[this._appointmentSettings["startTime"]], app[this._appointmentSettings["endTime"]], ""); 
            if (args.type != "beforeAppointmentCreate" && overlapList.length > 1) 
                args.cancel = true; 
            else if (args.type == "beforeAppointmentCreate" && overlapList.length > 0) 
                args.cancel = true; 
   } 
</Code> 

Kindly refer the above sample code and let us know, if you need any further assistance on this. 

Regards, 
Nevitha. 



AJ Andrew Jang October 17, 2017 10:11 PM UTC

Thank you for your reply, searching custom field works smoothly.

However, I am encountering a problem with overlapping appointments.

First of all, I am not getting anything back from _overlapApp function call after trying to dragging to overlap.


_overlapApp doesn't seem to be a member of 'this' object, is this the way it's supposed to be? What am I doing incorrectly?


Thank you for your support.



NR Nevitha Ravi Syncfusion Team October 18, 2017 01:21 PM UTC

Hi Andrew, 

We are sorry for the inconvenience caused. 

We have missed to cover the dragging scenario in our previously shared code snippet which have been now modified to prevent the overlapping of appointments in the sample that can be downloaded from the below location. 

<Code> 
  function onValidation(args) { 
        if (args.type == "beforeAppointmentChange") { 
            app = args.appointment.changed[0]; 
        } 
        else { 
            if (ej.isNullOrUndefined(args.appointment[0])) 
                app = args.appointment; 
            else 
                app = args.appointment[0]; 
        } 
        overlapList = this._overlapApp(app["AppTaskId"], app[this._appointmentSettings["startTime"]], app[this._appointmentSettings["endTime"]], ""); 
        if (args.type == "resizeStop" && overlapList.length > 1) 
            args.cancel = true; 
        else if ((args.type == "beforeAppointmentCreate" || args.type == "dragStop") && overlapList.length > 0) 
            args.cancel = true; 
    } 
</Code> 

Kindly try the above code in your sample to prevent overlapping appointments and also let us know, if you need any further assistance on this. 

Regards, 
Nevitha. 



MG MOULIN Guillaume January 15, 2020 04:00 PM UTC

Hi
Can you please provide sample for EJ2 ?

With <script src="https://cdn.syncfusion.com/ej2/dist/ej2.min.js"></script>
It seems that the funtion this._overlapApp() is not existing anymore...

Regards


HB Hareesh Balasubramanian Syncfusion Team January 17, 2020 12:45 PM UTC

Hi Moulin, 

Thanks for your update. 

We can achieve the same functionality using the isSlotAvailable method and actionBegin event. And for the same we have prepared sample, it can be viewed from the following link, 


For further reference kindly refer the below API links, 


Kindly try the above sample, if you have any concerns please revert us back for further assistance. 

Regards, 
Hareesh 


Loader.
Up arrow icon