Can I change default values?

[Alex]

Hi,

We have a customer who is looking to record timesheet information but rather than in blocks of hours, blocks of 6 minutes as shown below.  Is this possible with the Scheduler control?

[Alagumeena Kalaiselvan]

Hi Alex, 

Greetings from Syncfusion support! 

Yes, your reported scenario is possible with Scheduler component. The ScheduleTimeScale allows you to set the required time slots duration for the work cells. The Interval and SlotCount properties can be used together on the Scheduler to set different time slot duration. We have prepared a sample based on your reference. 

@using Syncfusion.EJ2.Blazor.Schedule 

@using System.Globalization 

 

<EjsSchedule TValue="AppointmentData" Height="650px"> 

    <ScheduleTimeScale Interval="60" SlotCount="10">   // Here 10 time slots together represents an hour 

        <MajorSlotTemplate> 

            <div>@(majorSlotTemplate((context as TemplateContext).Date))</div> 

        </MajorSlotTemplate> 

        <MinorSlotTemplate> 

            <div style="text-align: right; margin-right: 15px">@(minorSlotTemplate((context as TemplateContext).Date))</div> 

        </MinorSlotTemplate> 

    </ScheduleTimeScale> 

    <ScheduleViews> 

        <ScheduleView Option="View.Day"></ScheduleView> 

        <ScheduleView Option="View.Week"></ScheduleView> 

        <ScheduleView Option="View.WorkWeek"></ScheduleView> 

    </ScheduleViews> 

</EjsSchedule> 

 

@code{ 

    public static string majorSlotTemplate(DateTime date) 

    { 

        return date.ToLocalTime().ToString("hh", CultureInfo.InvariantCulture); 

    } 

    public static string minorSlotTemplate(DateTime date) 

    { 

        return date.ToLocalTime().ToString("mm", CultureInfo.InvariantCulture); 

    } 

    public class AppointmentData 

    { 

        public int Id { get; set; } 

        public string Subject { get; set; } 

        public string Location { get; set; } 

        public DateTime StartTime { get; set; } 

        public DateTime EndTime { get; set; } 

        public string Description { get; set; } 

        public bool IsAllDay { get; set; } 

        public string RecurrenceRule { get; set; } 

        public string RecurrenceException { get; set; } 

        public Nullable<int> RecurrenceID { get; set; } 

    } 

} 

Also you can download this sample using the following link 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ScheduleComponent1213691280  

Note:  Refer the below UG link for more details 

UG Link:  https://ej2.syncfusion.com/blazor/documentation/schedule/timescale/ 

Kindly try out with shared sample and get back to us, If you need further assistance. 

Regards 

Alagumeena.K 

[Alagumeena Kalaiselvan]

Hi Sushant, 

Thanks for your update! 

We have validated your reported query and you can use Datasource property along with Schedule by simply assign the list of data source collections to the DataSource options of the Scheduler within the ScheduleEventSettings tag. We have modified the already shared sample for your reference 

@using Syncfusion.EJ2.Blazor.Schedule 

@using System.Globalization 

 

<EjsSchedule TValue="AppointmentData" Height="650px" SelectedDate="@(new DateTime(2020, 3, 10))"> 

    <ScheduleTimeScale Interval="60" SlotCount="10"> 

        <MajorSlotTemplate> 

            <div>@(majorSlotTemplate((context as TemplateContext).Date))</div> 

        </MajorSlotTemplate> 

        <MinorSlotTemplate> 

            <div style="text-align: right; margin-right: 15px">@(minorSlotTemplate((context as TemplateContext).Date))</div> 

        </MinorSlotTemplate> 

    </ScheduleTimeScale> 

    <ScheduleViews> 

        <ScheduleView Option="View.Day"></ScheduleView> 

        <ScheduleView Option="View.Week"></ScheduleView> 

        <ScheduleView Option="View.WorkWeek"></ScheduleView> 

    </ScheduleViews> 

    <ScheduleEventSettings DataSource="@DataSource"></ScheduleEventSettings>    // To bind Local data 

</EjsSchedule> 

 

@code{ 

    List<AppointmentData> DataSource = new List<AppointmentData> 

    { 

        new AppointmentData { Id = 1, Subject = "Testing", StartTime = new DateTime(2020, 3, 13, 9, 30, 0) , EndTime = new DateTime(2020, 3, 13, 10, 30, 0)}, 

        new AppointmentData { Id = 2, Subject = "Conference", StartTime = new DateTime(2020, 3, 11, 10, 30, 0) , EndTime = new DateTime(2020, 3, 11, 12, 0, 0)}, 

        new AppointmentData { Id = 3, Subject = "Meeting", StartTime = new DateTime(2020, 3, 9, 9, 30, 0) , EndTime = new DateTime(2020, 3, 9, 11, 30, 0)}, 

        new AppointmentData { Id = 4, Subject = "Vacation", StartTime = new DateTime(2020, 3, 14, 11, 30, 0) , EndTime = new DateTime(2020, 3, 14, 13, 0, 0)} 

    }; 

    public static string majorSlotTemplate(DateTime date) 

    { 

        return date.ToLocalTime().ToString("hh", CultureInfo.InvariantCulture); 

    } 

    public static string minorSlotTemplate(DateTime date) 

    { 

        return date.ToLocalTime().ToString("mm", CultureInfo.InvariantCulture); 

    } 

    public class AppointmentData 

    { 

        public int Id { get; set; } 

        public string Subject { get; set; } 

        public string Location { get; set; } 

        public DateTime StartTime { get; set; } 

        public DateTime EndTime { get; set; } 

        public string Description { get; set; } 

        public bool IsAllDay { get; set; } 

        public string RecurrenceRule { get; set; } 

        public string RecurrenceException { get; set; } 

        public Nullable<int> RecurrenceID { get; set; } 

    } 

} 

Also you can get this sample using below link 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ScheduleComponent-1789081600 

Note:  Refer the below UG link for more details 

UG Link: https://blazor.syncfusion.com/documentation/scheduler/data-binding/ 

Kindly let us know, If you need further assistance. 

Regards 

Alagumeena.K