blazor-404563-components-scheduler-customization-user-actions.md
The DevExpress Blazor Scheduler allows you to restrict end-user operations that modify appointments. Use the following properties to specify operation availability:
| Event | Description |
|---|---|
| AllowCreateAppointment | Specifies whether users can create new appointments. |
| AllowEditAppointment | Specifies whether users can edit appointments. |
| AllowDeleteAppointment | Specifies whether users can delete appointments. |
| AllowDragAppointment | Specifies whether users can drag appointments. |
| AllowDragAppointmentBetweenResources | Specifies whether users can drag-and-drop appointments between resource groups. |
| AllowResizeAppointment | Specifies whether users can resize appointments. |
@using Data
<DxScheduler StartDate="@DateTime.Today"
DataStorage="@DataStorage"
AllowCreateAppointment="false"
AllowEditAppointment="false"
AllowDeleteAppointment="false">
<DxSchedulerWeekView/>
</DxScheduler>
@code {
DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage() {
AppointmentsSource = AppointmentCollection.GetAppointments(),
AppointmentMappings = new DxSchedulerAppointmentMappings() {
Type = "AppointmentType",
Start = "StartDate",
End = "EndDate",
Subject = "Caption",
AllDay = "AllDay",
Location = "Location",
Description = "Description",
LabelId = "Label",
StatusId = "Status",
RecurrenceInfo = "Recurrence"
}
};
}
using System;
namespace Scheduler.Data {
public static partial class ResourceAppointmentCollection {
public class ResourceAppointment {
public ResourceAppointment() { }
public bool Accepted { get; set; }
public int AppointmentType { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string Caption { get; set; }
public string Description { get; set; }
public string Location { get; set; }
public int? Label { get; set; }
public int Status { get; set; }
public bool AllDay { get; set; }
public string Recurrence { get; set; }
public int? ResourceId { get; set; }
}
}
}
using System;
using System.Collections.Generic;
using System.Linq;
namespace Scheduler.Data {
public static partial class ResourceAppointmentCollection {
public static List<ResourceAppointment> GetAppointments() {
DateTime date = DateTime.Now.Date;
var dataSource = new List<ResourceAppointment>() {
new ResourceAppointment {
Accepted = true,
Caption = "Install New Router in Dev Room",
StartDate = date + (new TimeSpan(0, 10, 0, 0)),
EndDate = date + (new TimeSpan(0, 12, 0, 0)),
Status = 1,
ResourceId = 0
},
new ResourceAppointment {
Caption = "Upgrade Personal Computers",
Accepted = false,
StartDate = date + (new TimeSpan(0, 13, 0, 0)),
EndDate = date + (new TimeSpan(0, 14, 30, 0)),
Status = 1,
ResourceId = 0
},
new ResourceAppointment {
Caption = "Website Redesign Plan",
Accepted = false,
StartDate = date + (new TimeSpan(1, 9, 30, 0)),
EndDate = date + (new TimeSpan(1, 11, 30, 0)),
Status = 1,
ResourceId = 0
},
new ResourceAppointment {
Caption = "New Brochures",
Accepted = true,
StartDate = date + (new TimeSpan(1, 13, 30, 0)),
EndDate = date + (new TimeSpan(1, 15, 15, 0)),
Status = 1,
ResourceId = 0
},
new ResourceAppointment {
Caption = "Book Flights to San Fran for Sales Trip",
Accepted = false,
StartDate = date + (new TimeSpan(1, 12, 0, 0)),
EndDate = date + (new TimeSpan(1, 13, 0, 0)),
AllDay = true,
Status = 1,
ResourceId = 0
},
new ResourceAppointment {
Caption = "Approve Personal Computer Upgrade Plan",
Accepted = true,
StartDate = date + (new TimeSpan(0, 10, 0, 0)),
EndDate = date + (new TimeSpan(0, 12, 0, 0)),
Status = 1
},
new ResourceAppointment {
Caption = "Final Budget Review",
Accepted = true,
StartDate = date + (new TimeSpan(0, 13, 0, 0)),
EndDate = date + (new TimeSpan(0, 15, 0, 0)),
Status = 1,
ResourceId = 1
},
new ResourceAppointment {
Caption = "Install New Database",
Accepted = false,
StartDate = date + (new TimeSpan(0, 9, 45, 0)),
EndDate = date + (new TimeSpan(1, 11, 15, 0)),
Status = 1,
ResourceId = 1
},
new ResourceAppointment {
Accepted = true,
Caption = "Approve New Online Marketing Strategy",
StartDate = date + (new TimeSpan(1, 12, 0, 0)),
EndDate = date + (new TimeSpan(1, 14, 0, 0)),
Status = 1,
ResourceId = 1
},
new ResourceAppointment {
Accepted = true,
Caption = "Customer Workshop",
StartDate = date + (new TimeSpan(0, 11, 0, 0)),
EndDate = date + (new TimeSpan(0, 12, 0, 0)),
AllDay = true,
Status = 1,
ResourceId = 2
},
new ResourceAppointment {
Accepted = true,
Caption = "Prepare 2021 Marketing Plan",
StartDate = date + (new TimeSpan(0, 11, 0, 0)),
EndDate = date + (new TimeSpan(0, 13, 30, 0)),
Status = 1,
ResourceId = 2
},
new ResourceAppointment {
Accepted = false,
Caption = "Brochure Design Review",
StartDate = date + (new TimeSpan(0, 14, 0, 0)),
EndDate = date + (new TimeSpan(0, 15, 30, 0)),
Status = 1,
ResourceId = 2
},
new ResourceAppointment {
Accepted = true,
Caption = "Create Icons for Website",
StartDate = date + (new TimeSpan(1, 10, 0, 0)),
EndDate = date + (new TimeSpan(1, 11, 30, 0)),
Status = 1,
ResourceId = 1
},
new ResourceAppointment {
Accepted = true,
Caption = "Launch New Website",
StartDate = date + (new TimeSpan(1, 12, 20, 0)),
EndDate = date + (new TimeSpan(1, 14, 0, 0)),
Status = 1,
ResourceId = 2
},
new ResourceAppointment {
Accepted = false,
Caption = "Upgrade Server Hardware",
StartDate = date + (new TimeSpan(1, 9, 0, 0)),
EndDate = date + (new TimeSpan(1, 12, 0, 0)),
Status = 1,
ResourceId = 2
},
new ResourceAppointment {
Accepted = true,
Caption = "Book Flights to San Fran for Sales Trip",
StartDate = date + (new TimeSpan(0, 14, 0, 0)),
EndDate = date + (new TimeSpan(0, 17, 0, 0)),
Status = 1,
ResourceId = 3
},
new ResourceAppointment {
Accepted = true,
Caption = "Approve New Online Marketing Strategy",
StartDate = date + (new TimeSpan(0, 12, 0, 0)),
EndDate = date + (new TimeSpan(0, 15, 0, 0)),
Status = 1,
ResourceId = 4
}
};
return dataSource;
}
public static List<Resource> GetResourcesForGrouping() {
return GetResources().Take(3).ToList();
}
public static List<Resource> GetResources() {
return new List<Resource>() {
new Resource() { Id=0 , Name="John Heart", GroupId=100, BackgroundCss="dxbl-green-color", TextCss="text-white" },
new Resource() { Id=1 , Name="Samantha Bright", GroupId=101, BackgroundCss="dxbl-orange-color", TextCss="text-white" },
new Resource() { Id=2 , Name="Arthur Miller", GroupId=100, BackgroundCss="dxbl-purple-color", TextCss="text-white" },
new Resource() { Id=3 , Name="Robert Reagan", GroupId=101, BackgroundCss="dxbl-indigo-color", TextCss="text-white" },
new Resource() { Id=4 , Name="Greta Sims", GroupId=100, BackgroundCss="dxbl-red-color", TextCss="text-white" }
};
}
public static List<Resource> GetResourceGroups() {
return new List<Resource>() {
new Resource() { Id=100, Name="Sales and Marketing", IsGroup=true },
new Resource() { Id=101, Name="Engineering", IsGroup=true }
};
}
}
}
Run Demo: Scheduler - Restrict/Limit User Actions
The DevExpress Blazor Scheduler includes events that allow you to customize user actions. You can implement additional functionality or cancel actions when necessary. You can even implement a role-based system where users can interact with appointments based on their permissions.
| Event | Description |
|---|---|
| AppointmentCreating | Fires before an appointment is created. |
| AppointmentCreated | Fires after an appointment is created. |
| AppointmentInserted | Fires after a new appointment is added to the AppointmentsSource object. |
| AppointmentInserting | Fires before a new appointment is added to the AppointmentsSource object. |
| AppointmentUpdating | Fires before an updated appointment is saved to the AppointmentsSource object. |
| AppointmentUpdated | Fires after an updated appointment is saved to the AppointmentsSource object. |
| AppointmentRemoved | Fires after an appointment is removed from the AppointmentsSource object. |
| AppointmentRemoving | Fires before an appointment is removed from the AppointmentsSource object. |
| AppointmentStartDragging | Fires when a user starts dragging an appointment. |
| AppointmentStartResizing | Fires when a user starts resizing an appointment. |
| AppointmentDraggingBetweenResources | Fires before an appointment is removed from the AppointmentsSource object. |
The following code snippet allows only a certain type of appointment resize operation: the resulting appointment must occur within work hours.
<DxScheduler StartDate="@DateTime.Today"
DataStorage="@DataStorage"
GroupType="SchedulerGroupType.Resource"
AppointmentStartResizing="OnStartResizing">
...
</DxScheduler>
<DxPopup @bind-Visible="@AlertVisible"
CloseOnEscape="true"
CloseOnOutsideClick="true"
ShowCloseButton="true"
HeaderText="Warning!"
BodyText="The appointment can belong only to the current user and can start and end only during the working time interval.">
</DxPopup>
@code {
...
DxSchedulerTimeSpanRange WorkTime = new DxSchedulerTimeSpanRange(TimeSpan.FromHours(9), TimeSpan.FromHours(18));
bool AlertVisible = false;
int CurrentUserResourceId = 0;
bool IsCurrentUsersAppointment(DxSchedulerAppointmentItem apt) => apt.ResourceId as int? == CurrentUserResourceId;
bool IsInWorkTime(DxSchedulerAppointmentItem apt) =>
apt.AllDay ||
apt.Start - apt.Start.Date >= WorkTime.Start
&& WorkTime.End >= apt.End - apt.End.Date;
void OnStartResizing(SchedulerAppointmentOperationEventArgs args) {
if (!IsCurrentUsersAppointment(args.Appointment) || !IsInWorkTime(args.Appointment)) {
args.Cancel = true;
AlertVisible = showAlert;
}
}
}
Run Demo: Scheduler - Customize User Actions
View Example: Scheduler for Blazor - How to implement CRUD operations with a Web API Service