Currently, creating an appointment is made by double clicking on a slot. The case of single clicking to create an appointment is already in another request.
If you take the example of Google agenda, you can create an appointment by selecting directly the dates by sweeping with one long single click.
Here would be the request:
An event similar to SchedulerEditEventArgs (containing Start, End, IsAllDay, IsNew ; IsCancelled: to be able to have a custom edit form) that would be triggered with one long single click selecting the dates/hours slots of the appointment.
---
ADMIN EDIT
---
Although the discussion targets different functionality, we are keeping the current request open as we consider it valid to ensure better UX for appointment creation on mobile devices and we would like to see how the demand for that goes.
I have located an issue with the scheduler in Firefox
It currently is not possible to edit an appointment in Firefox when visiting the following demo page:
https://demos.telerik.com/blazor-ui/scheduler/appointment-editing
Edge and Chrome work as expected.
I noticed this issue in my local project and referred to the demo's to see if I was doing something stupid :-).
I am assuming that the demo's are running in .net 5 and that the demo's are blazor server applications.
I would like an indicator of the current time in the scheduler that updates itself (as often as every minute) without the need to reload the page. Like in the Reach suite: https://www.telerik.com/kendo-react-ui/components/scheduler/views/day/#toc-current-time-marker
---
ADMIN EDIT
You may find interesting this related request for more precise appointment rendering: https://feedback.telerik.com/blazor/1451797-more-precise-representation-of-start-end-times-on-scheduler-exact-time-rendering. If so, Vote for it and Follow it as well.
---
I would like to suggest a new View for the Scheduler: The Scheduler List View / Agenda View.
Unless the other views, it's not based on the usual calender-like view, but more like an "Agenda View". It would be a very good improvement and it's used in most common software products as well (e.g. Outlook).
Sources for inspiration
https://fullcalendar.io/demos - select list view on upper right
https://www.syncfusion.com/blazor-components/blazor-scheduler - search for "Agenda view"
https://docs.devexpress.com/WindowsForms/115961/controls-and-libraries/scheduler/views/agenda-view
https://docs.telerik.com/devtools/winforms/controls/scheduler/views/agenda-view
Is this available for blazor? if not could it be added somehow temporarily until support for it is added?
https://demos.telerik.com/aspnet-mvc/scheduler/yearview
The application users would like the scheduler to default to the work day view instead of the full day view.
Currently the only way to do this is to create a @ref to a property on my page and then override OnAfterRender to set the ShowWorkHours property to true. When examining the property I see that it is decorated with a HideFromApiRef attribute. Would it not be possible to change that to a Parameter so that the property could be set in the definition, or even bound to a variable?
Request either demo or functionality to either allow for "paging" of large scheduler data or functionality to utilize odata format for performance of scheduler data presentation.
My query even with just a year of data takes a few seconds to fetch from the database as well as several more seconds for the scheduler to process the data. Having functionality for changing views or switching days/weeks/months to allow for quick data updates from the back end would greatly improve overall performance.
A context menu event similar to the grid context menu would be useful for editing functions like cut/copy and paste.
---
ADMIN EDIT
You can use the item template to integrate context menus in the scheduler: https://github.com/telerik/blazor-ui/tree/master/scheduler/appointment-context-menu. This also allows you a lot of other customization options like adding tooltips and changing the appearance/information users see at first glance.
For a context menu on the slots - probably this item will expose a template for them so the same approach would apply.
---
Hi fellows,
I just wanted to know, if it's possible to use the timeline view in blazor as well (compared to asp.net core?).
And if so, how can I do it?
If not: are there any plans in the pipe for activating this feature?
Best regards
Pascal
Currently, you can only initiate editing/creating of an appointment in the Scheduler on double click. I'd like to be able to trigger these operations on single click.
It will be nice to have EditOn parameter to allow choosing if editing/creating will fire on single or double click of an appointment/slot.
Currently, when using an ItemTemplate, I cannot get the details for the current occurrence from the template context as it cannot be differentiated from the series.
===
TELERIK EDIT:
In the meantime, it is possible to get the occurrence details with JavaScript. The occurrence start and end DateTime are rendered as an aria-label HTML attribute of the <div class="k-event"> element.
@inject IJSRuntime js
<TelerikScheduler Data="@SchedulerData"
@bind-Date="@SelectedDate"
Height="600px">
<SchedulerViews>
<SchedulerMultiDayView StartTime="@StartTime" />
</SchedulerViews>
<ItemTemplate>
<div onclick="getOccurrenceDateTime(event)" style="height:100%">
@{ var appointment = (Appointment)context; }
@appointment.Title (CLICK ME)
</div>
</ItemTemplate>
</TelerikScheduler>
@* Move JavaScript code to a separate JS file *@
<script suppress-error="BL9992">
function getOccurrenceDateTime(e) {
alert(e.target.closest("div.k-event").getAttribute("aria-label"));
}
</script>
@code {
private AppointmentService appointmentService = new();
private DateTime SelectedDate { get; set; } = DateTime.Now.Date;
private DateTime StartTime { get; set; } = DateTime.Now.Date.AddHours(7);
private List<Appointment> SchedulerData = new List<Appointment>();
protected override async Task OnInitializedAsync()
{
SchedulerData = await appointmentService.GetAppointmentsAsync();
}
public class AppointmentService
{
public async Task<List<Appointment>> GetAppointmentsAsync()
{
await Task.Delay(1);
return GetAppointments();
}
public List<Appointment> GetAppointments()
{
List<Appointment> data = new List<Appointment>();
DateTime baselineTime = GetStartTime();
data.Add(new Appointment
{
Title = "Daily Meeting",
Description = "Daily Meeting",
Start = baselineTime.AddHours(1),
End = baselineTime.AddHours(1).AddMinutes(30),
RecurrenceRule = "FREQ=DAILY;BYDAY=MO,TU,WE,TH,FR"
});
return data;
}
public DateTime GetStartTime()
{
DateTime dt = DateTime.Now;
int daysSinceMonday = dt.DayOfWeek - DayOfWeek.Monday;
return new DateTime(dt.Year, dt.Month, dt.Day - daysSinceMonday, 8, 0, 0);
}
}
public class Appointment
{
public Guid Id { get; set; }
public string Title { get; set; } = string.Empty;
public DateTime Start { get; set; }
public DateTime End { get; set; }
public bool IsAllDay { get; set; }
public string Description { get; set; } = string.Empty;
public string RecurrenceRule { get; set; } = string.Empty;
public Appointment()
{
var rand = new Random();
Id = Guid.NewGuid();
}
}
}
I'd like to be able to search and filter the appointments in the Scheduler. Please add support for Searchbox in the Scheduler Toolbar as in the Telerik UI for ASP.NET Core.