diff --git a/CS/DxBlazorApplication1/Components/Pages/Index.razor b/CS/DxBlazorApplication1/Components/Pages/Index.razor index c16d6c7..ca972a1 100644 --- a/CS/DxBlazorApplication1/Components/Pages/Index.razor +++ b/CS/DxBlazorApplication1/Components/Pages/Index.razor @@ -55,9 +55,9 @@ - + @@ -74,14 +74,14 @@ - + diff --git a/CS/DxBlazorApplication1/Components/Pages/Index.razor.cs b/CS/DxBlazorApplication1/Components/Pages/Index.razor.cs index 1ecd2da..491a794 100644 --- a/CS/DxBlazorApplication1/Components/Pages/Index.razor.cs +++ b/CS/DxBlazorApplication1/Components/Pages/Index.razor.cs @@ -37,7 +37,7 @@ public partial class Index : ComponentBase { ResourceId = "LecturerIds", TimeZoneId = "TimeZoneId", CustomFieldMappings = new List { - new DxSchedulerCustomFieldMapping { Name = "Grade", Mapping = "Grade" } + new DxSchedulerCustomFieldMapping { Name = "DegreeLevel", Mapping = "DegreeLevel" } } }, ResourceMappings = new DxSchedulerResourceMappings() { diff --git a/CS/DxBlazorApplication1/Models/UIModels/CustomAppointmentFormInfo.cs b/CS/DxBlazorApplication1/Models/UIModels/CustomAppointmentFormInfo.cs index 1488020..c9cf20f 100644 --- a/CS/DxBlazorApplication1/Models/UIModels/CustomAppointmentFormInfo.cs +++ b/CS/DxBlazorApplication1/Models/UIModels/CustomAppointmentFormInfo.cs @@ -7,9 +7,9 @@ public class CustomAppointmentFormInfo : SchedulerAppointmentFormInfo { public CustomAppointmentFormInfo(DxSchedulerAppointmentItem AppointmentItem, DxSchedulerDataStorage DataStorage, DxScheduler scheduler) : base(AppointmentItem, DataStorage, scheduler) { } - public string? Grade { - get { return CustomFields["Grade"]?.ToString(); } - set { CustomFields["Grade"] = value; } + public string? DegreeLevel { + get { return CustomFields["DegreeLevel"]?.ToString(); } + set { CustomFields["DegreeLevel"] = value; } } } } diff --git a/CS/DxBlazorApplication1/Models/UniversityClass.cs b/CS/DxBlazorApplication1/Models/UniversityClass.cs index ffca521..8aa6848 100644 --- a/CS/DxBlazorApplication1/Models/UniversityClass.cs +++ b/CS/DxBlazorApplication1/Models/UniversityClass.cs @@ -25,6 +25,6 @@ public class UniversityClass { public string? RecurrenceInfo { get; set; } public string? ReminderInfo { get; set; } public string? TimeZoneId { get; set; } - public string? Grade { get; set; } + public string? DegreeLevel { get; set; } } } diff --git a/CS/DxBlazorApplication1/Services/DataHelpers/LabelDataHelper.cs b/CS/DxBlazorApplication1/Services/DataHelpers/LabelDataHelper.cs index 6e4a453..03f2fd7 100644 --- a/CS/DxBlazorApplication1/Services/DataHelpers/LabelDataHelper.cs +++ b/CS/DxBlazorApplication1/Services/DataHelpers/LabelDataHelper.cs @@ -14,7 +14,7 @@ public class LabelDataHelper { private static readonly List lectureTypes = new List() { new(){ Id = 1, Name = "Lecture", Color = Color.Coral, BackgroundCssClass = "label-1", TextCssClass = "label-1" }, new(){ Id = 2, Name = "Seminar", Color = Color.ForestGreen, BackgroundCssClass = "label-2", TextCssClass = "label-2" }, - new(){ Id = 3, Name = "Laboratory", Color = Color.LightSkyBlue, BackgroundCssClass = "label-3", TextCssClass = "label-3" }, + new(){ Id = 3, Name = "Lab", Color = Color.LightSkyBlue, BackgroundCssClass = "label-3", TextCssClass = "label-3" }, }; } } diff --git a/README.md b/README.md index 7cf1356..4591f5d 100644 --- a/README.md +++ b/README.md @@ -1,38 +1,40 @@ -![](https://img.shields.io/endpoint?url=https://codecentral.devexpress.com/api/v1/VersionRange/1027761813/25.1.4%2B) [![](https://img.shields.io/badge/Open_in_DevExpress_Support_Center-FF7200?style=flat-square&logo=DevExpress&logoColor=white)](https://supportcenter.devexpress.com/ticket/details/T1304528) [![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183) [![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives) -# Product/Platform - Task +# Blazor Scheduler - Customize Appointment Forms -This is the repository template for creating new examples. Describe the solved task here. +This example creates custom extended and compact appointment forms for DevExpress Blazor Scheduler. In addition to standard content, custom forms display appointment time zone and an extra layout item (**Degree Level**). -Put a screenshot that illustrates the result here. +Refer to the following help topic for information on how to create custom appointment forms: [Custom Appointment Forms and Tooltips](https://docs.devexpress.com/Blazor/404564/components/scheduler/customization/appointment-forms-and-tooltips#custom-appointment-form). -Then, add implementation details (steps, code snippets, and other technical information in a free form), or add a link to an existing document with implementation details. +Both standard and customized appointment forms support [CRUD operations](/CS/DxBlazorApplication1/Components/Pages/Index.razor.cs). For your convenience, we created a data source that contains different appointment types: one-time or recurring, all-day or with specific start/end times, assigned to a single or multiple resources. Our example generates the data source at runtime and binds it to the Scheduler via [services](/CS/DxBlazorApplication1/Services/). To bind a Scheduler in your own application, you can use the same code-behind, but you must implement your own [interfaces](/CS/DxBlazorApplication1/Services/Interfaces). + +![Custom Appointment Forms](./result.png) ## Files to Review -- link.cs (VB: link.vb) -- link.js -- ... +- [Index.razor](/CS/DxBlazorApplication1/Components/Pages/Index.razor) +- [Index.razor.cs](/CS/DxBlazorApplication1/Components/Pages/Index.razor.cs) +- [Models](/CS/DxBlazorApplication1/Models/) +- [Services](/CS/DxBlazorApplication1/Services/) ## Documentation -- link -- link -- ... +- [Custom Appointment Forms and Tooltips](https://docs.devexpress.com/Blazor/404564/components/scheduler/customization/appointment-forms-and-tooltips#custom-appointment-form) ## More Examples -- link -- link -- ... +- [Load appointments for visible interval only (lazy loading)](https://github.com/DevExpress-Examples/blazor-scheduler-load-appointments-range) +- [Implement CRUD operations with a Web API Service](https://github.com/DevExpress-Examples/blazor-scheduler-bind-to-web-api-service) + -## Does this example address your development requirements/objectives? - -[](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=blazor-scheduler-custom-form&~~~was_helpful=yes) [](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=blazor-scheduler-custom-form&~~~was_helpful=no) - +## Does this example address your development requirements/objectives? + +[](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=blazor-scheduler-custom-form&~~~was_helpful=yes) [](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=blazor-scheduler-custom-form&~~~was_helpful=no) + (you will be redirected to DevExpress.com to submit your response) + + diff --git a/result.png b/result.png new file mode 100644 index 0000000..1bbe7f7 Binary files /dev/null and b/result.png differ