Only allow create appointments every hour or half an hour

[Andrew Jang]

Hi, I have a Scheduler on my project as following:

@(Html.EJ().Schedule("ELLCalendar")

                .Width("100%")

                .Height("525px")

                .CurrentDate(DateTime.Today)

                .CurrentView(CurrentView.Day)

                .ShowWeekend(false)

                .Orientation(Orientation.Horizontal)

                .TimeScale(ts => ts.Enable(true).majorSlot(60).minorSlotCount(2))

                .Resources(res => { res.Field("SlotId").Title("Slot").Name("Slots").AllowMultiple(true).ResourceSettings(flds => flds.Datasource(ViewBag.Slots).Text("Text").Id("id").GroupId("GroupId").Color("color")).Add(); })

                .Group(gr =>

                 {

                     gr.Resources(ViewBag.Resources);

                 })

                .AppointmentSettings(fields => fields.Datasource(Model)

                    .ApplyTimeOffset(false)

                    .Id("Id")

                    .Subject("Subject")

                    .StartTime("StartTime")

                    .EndTime("EndTime")

                    .Description("Description")

                    .Location("Location")

                    .Categorize("Categorize")

                    .AllDay("IsAllDay")

                    .Recurrence("IsRecurrence")

                    .RecurrenceRule("RecurrenceRule"))

                .ReadOnly(ViewBag.Editable)

                .StartHour(8)

                .EndHour(19)

                .ReadOnly(ViewBag.ReadOnly)

                .EnableAppointmentResize(false)

  )

Now, I want all appointments to start and end at 00th minute or at 30th minute (e.g. from 6:00am - 6:30AM, instead of 6:10 - 6:40).

How can I program so that I can enforce this?

[Karthigeyan Krishnamurthi]

Hi Andrew, 

 

Thank you for contacting Syncfusion support. 

 

By default, all appointments will be created only with 30 minutes interval, only on resizing and dragging the default interval will be set to 10. In latest version, we can customize the resizing and dragging interval and for the same we have prepared the below sample for your reference. 

http://jsplayground.syncfusion.com/phss1l5s 

 

<Code> 

drag: "customInterval", 

resize: "customInterval" 

 

function customInterval(args) { 

    args.interval = 30; 

} 

</Code> 

 

Regards, 

Karthigeyan 

[Andrew Jang]

Hi, I believe I've upgraded my project into the latest Syncfusion Version at this moment. (v 15.3.0.33)

I've done this by following steps.

https://help.syncfusion.com/common/faq/how-to-upgrade-the-project-into-a-new-syncfusion-version

Since "Project Migration Utility" was not available on my Synfusion Essential Studio for some reason, I've upgraded it manually.

However, I still don't see "Drag" or "Resize" property that you mentioned for EJ().Schedule.

Any suggestions??

[Sellakumar]

Hi Andrew, 

 

Thanks for your update. 

 

The Drag and Resize events of Schedule are available within the “ScheduleClientSideEvents” property. The client side events needs to be defined as follows: 

 

<code> 

 

Razor: 

 

@(Html.EJ().Schedule("Schedule") 

        .Width("100%") 

        .Height("525px") 

        .ScheduleClientSideEvents(evt => evt.Drag("customInterval").Resize("customInterval")) 

        .CurrentDate(new DateTime(2017, 1, 2)) 

    ) 

) 

Javascript: 

 

function customInterval(args) { 

     args.interval = 30; 

} 

 

</code> 

 

We have also prepared the sample based on your requirement which can be download from the following location:  

Download 

Kindly check the above sample and revert us with further details, if we have misunderstood your requirement or else if you need any further assistance on this. 

Regards, 

Sellakumar K

[Andrew Jang]

This works! Thank you!

[Nevitha Ravi]

Hi Andrew, 

  

We are happy that our solution has fulfilled your requirement. Kindly let us know if you need any assistance. 

  

Regards, 

Nevitha.