Can I able to use the Appointment editor window without the scheduler Appointment Planner window?

[Thayaparan Kumarakuru]

Hello Team,

Using asp.net Forum. we need to open the appointment window by id in javascript. How to do this?

Regards

Thayaparan

[Vengatesh Maniraj]

Hi Thayaparan,

Greetings from Syncfusion.

We have checked your requirement and suspect that your requirement is to make the appointment editor window with your own style instead of the default one. If so please refer to the below link that may help you to achieve your requirement. 

https://help.syncfusion.com/aspnet/schedule/customization#appointment-window-customization

Kindly check the above and if this is not meet your requirement, could you please share more details about your requirement? It will helps to proceed further and provide the solution earlier.

Regards,

Vengatesh 

[Thayaparan Kumarakuru]

Hello Team

we don't want to customize the window, but we need to open the default appointment window in clientside using coding and pass the appointment id.

[Vengatesh Maniraj]

Hi Thayaparan,

Please find the below sample that helps you to open the appointment window on client-side.

      function onClick() {

            var obj = $("#Schedule1").data("ejSchedule");

            var args = obj.getAppointments().find(x=>x.Id==102); // 102 is appointment id

            if (args.Recurrence) {

                var query = new ej.Query().where("Guid", ej.FilterOperators.equal, obj._appUid);

                var templist = new ej.DataManager(obj._processed).executeLocal(query);

                obj._parentId = templist[0]["ParentId"];

                obj._currentAction = ej.Schedule.Actions.EditOccurrence;

            }

            else

                obj._currentAction = ej.Schedule.Actions.Save;

            obj._showAppointmentDetails(args.Guid, true);

            obj._appointmentAddWindow.find('.subject').val(args.Subject);

            obj._appointmentAddWindow.find('.e-description').val(args.Description);

            obj._appointmentAddWindow.find("#" + obj._id + "startdate").ejDatePicker("option", "value", ej.format(args.StartTime, obj._datepattern(), obj.model.locale));

            obj._appointmentAddWindow.find("#" + obj._id + "enddate").ejDatePicker("option", "value", ej.format(args.EndTime, obj._datepattern(), obj.model.locale));

            obj._appointmentAddWindow.find("#" + obj._id + "starttime").ejTimePicker("option", "value", ej.format(args.StartTime, obj._pattern.t, obj.model.locale));

            obj._appointmentAddWindow.find("#" + obj._id + "endtime").ejTimePicker("option", "value", ej.format(args.EndTime, obj._pattern.t, obj.model.locale));

            var stZoneValue = !ej.isNullOrUndefined(args[obj._appointmentSettings["startTimeZone"]]) ? args[obj._appointmentSettings["startTimeZone"]] : (obj.model.timeZone == null) ? obj._timezoneStringValue() : obj.model.timeZone;

            stZoneValue = stZoneValue.indexOf("UTC") != 0 ? "UTC " + stZoneValue : stZoneValue;

            var edZoneValue = !ej.isNullOrUndefined(args[obj._appointmentSettings["endTimeZone"]]) ? args[obj._appointmentSettings["endTimeZone"]] : (obj.model.timeZone == null) ? obj._timezoneStringValue() : obj.model.timeZone;

            edZoneValue = edZoneValue.indexOf("UTC") != 0 ? "UTC " + edZoneValue : edZoneValue;

            var stvalue = obj._findResourceIndex(obj.model.timeZoneCollection.dataSource, obj.model.timeZoneCollection["value"], stZoneValue);

            var edvalue = obj._findResourceIndex(obj.model.timeZoneCollection.dataSource, obj.model.timeZoneCollection["value"], edZoneValue);

            obj._appointmentAddWindow.find("#" + obj._id + "startTimeZone").ejDropDownList("option", { text: obj.model.timeZoneCollection.dataSource[stvalue][obj.model.timeZoneCollection["text"]], value: obj.model.timeZoneCollection.dataSource[stvalue][obj.model.timeZoneCollection["value"]] });

            obj._appointmentAddWindow.find("#" + obj._id + "endTimeZone").ejDropDownList("option", { text: obj.model.timeZoneCollection.dataSource[edvalue][obj.model.timeZoneCollection["text"]], value: obj.model.timeZoneCollection.dataSource[edvalue][obj.model.timeZoneCollection["value"]] });

            if (args.appointment.Recurrence) {

                obj._appointmentAddWindow.find(".recurrence").ejCheckBox({ checked: true, enabled: false });

                obj._appointmentAddWindow.find(".e-repeatlbl").addClass('e-disable');

            }

        }

     

Sample: http://jsplayground.syncfusion.com/nm2jtmvm

Regards,

Vengatesh