Search results

Set Different Working Hours on Different Days in ASP.NET Core Schedule control

20 Jan 2022 / 1 minute to read

By default, the work hours of the Scheduler is highlighted based on the start and end values provided within the workHours property which remains same for all days. To highlight different work hours range for different days,setWorkHours method. You can pass date object/ multiple date objects collection as first argument and start and end time need to be added as work hours should be passed as second and third arguments respectively. In the following code example, on button click 11:00 AM to 08:00 PM of 15th and 17th February has been added in work hours.

Copied to clipboard
@using Syncfusion.EJ2.Schedule

    <ejs-button id="btn1" content="Change the work hours"></ejs-button>

<div class="control_wrapper schedule-control-section">
    <ejs-schedule id="schedule" height="550" views="@ViewBag.view" selectedDate="new DateTime(2018, 2, 15)">
        <e-schedule-workhours highlight="true" start="09:00" end="11:00"></e-schedule-workhours>

<script type="text/javascript">
    document.getElementById('btn1').onclick = function () {
        var scheduleObj = document.getElementById('schedule').ej2_instances[0];
        var dates = [new Date(2018, 1, 15), new Date(2018, 1, 17)];
        scheduleObj.setWorkHours(dates, '11:00', '20:00');
Copied to clipboard
public ActionResult Index()
    List<ScheduleView> viewOption = new List<ScheduleView>()
        new ScheduleView { Option = Syncfusion.EJ2.Schedule.View.Day },
        new ScheduleView { Option = Syncfusion.EJ2.Schedule.View.Week },
        new ScheduleView { Option = Syncfusion.EJ2.Schedule.View.WorkWeek },
        new ScheduleView { Option = Syncfusion.EJ2.Schedule.View.Month }
    ViewBag.view = viewOption;
    return View();