Unplanned
Last Updated: 12 Jul 2024 11:27 by Dario
Currently, I'm making specific cells undroppable zones by conditionally executing the logic inside the OnUpdate handler. When I drag over a cell that does not allow dropping in the Scheduler, I want the hint to indicate an undroppable zone.
Declined
Last Updated: 05 Jul 2024 08:55 by ADMIN
Created by: Maximilian
Comments: 1
Category: Scheduler
Type: Bug Report
0

Hi, 

I'm building a Grid which contains a nested Grid in it's `<DetailTemplate/>`.

When I'm opening the details, the grid events fire, the data gets loaded correctly but the data doesn't show up in the UI. Using .NET 8 Blazor with Telerik UI for Blazor Version 6.0.2.

 

This is the grid containing the Grid (data here gets loaded correctly):


<TelerikGrid @ref="@_grid" TItem="ChecklistDetailModel" Pageable Page="@_settings.CurrentPageNumber" PageSize="@_settings.Limit" OnRead="@OnPageReadAsync" Width="100%" Height="100%">
    <GridToolBarTemplate>
        <LawAreaSelect SelectedLawAreaId="_settings.SelectedLawAreaId" SelectedCountryId="_settings.SelectedCountryId" OnLawAreaSelected="OnLawAreaSelected" Width="250px" />
        <CountriesSelect Value="_settings.SelectedCountryId" OnChangeCallback="OnCountrySelected" Width="250px" />
        <TelerikButton Icon="FontIcon.FileAdd" OnClick="OnCreateChecklistButtonClick" Title="@Localizer["ChecklistOverview.Create"]" />
    </GridToolBarTemplate>
    <GridColumns>
        <GridColumn Title="ID" Width="50px">
            <Template Context="checklist">
                @{
                    var model = checklist as ChecklistDetailModel;
                    <span>@model.Id</span>
                }
            </Template>
        </GridColumn>
        <GridColumn Title="@Localizer["Data.LawArea"]">
            <Template Context="checklist">
                @{
                    var model = checklist as ChecklistDetailModel;
                    <span>@model.LawArea.Name</span>
                }
            </Template>
        </GridColumn>
        <GridColumn Title="@Localizer["Data.Country"]">
            <Template Context="checklist">
                @{
                    var model = checklist as ChecklistDetailModel;
                    <span>@model.Country.Name</span>
                }
            </Template>
        </GridColumn>
        <GridColumn Title="@Localizer["Data.Checklist.Revision"]">
            <Template Context="checklist">
                @{
                    var model = checklist as ChecklistDetailModel;
                    @if (model.RevisionName != null)
                    {
                        <span>@model.RevisionName</span>
                    }
                    else
                    {
                        <i>@Localizer["Data.Checklist.NoRevision"]</i>
                    }
                }
            </Template>
        </GridColumn>
        <GridColumn Title="@Localizer["Data.ChecklistRevisionDate"]">
            <Template Context="checklist">
                @{
                    var model = checklist as ChecklistDetailModel;
                    @if (model.LastUpdated.HasValue)
                    {
                        <span>@model.LastUpdated.Value.ToShortDateString()</span>
                    }
                    else
                    {
                        <span>@model.CreatedDate.ToShortDateString()</span>
                    }
                }
            </Template>
        </GridColumn>
        <GridCommandColumn>
            <GridCommandButton Icon="FontIcon.EditTools" OnClick="OnEditChecklistButtonClick" />
            <GridCommandButton Icon="FontIcon.PaperPlane" OnClick="OnAssignChecklistButtonClick" />
        </GridCommandColumn>
    </GridColumns>
    <DetailTemplate Context="checklist">
        <CustomerChecklistGrid ChecklistId="checklist.Id" OnEditCustomerChecklistButtonClick="OnEditCustomerChecklistButtonClick" OnNavigateToCustomerChecklistButtonClick="OnNavigateToCustomerChecklistButtonClick" />
    </DetailTemplate>
</TelerikGrid>

This is the `CustomerChecklistGrid` code inserted into the DetailTemplate of the Grid above:


<TelerikGrid @ref="_grid" TItem="CustomerChecklistModel" Pageable Page="_settings.CurrentPageNumber" PageSize="_settings.Limit" OnRead="OnPageReadAsync">
    <GridToolBarTemplate>
        <CustomerSelect OnCustomerSelected="OnCustomerSelected" SelectedCustomerId="_settings.SelectedCustomerId" Width="250px" />
    </GridToolBarTemplate>
    <GridColumns>
        <GridColumn Title="ID" Width="50px">
            <Template Context="customerChecklist">
                @{
                    var model = customerChecklist as CustomerChecklistModel;
                    <span>@model.Id</span>
                }
            </Template>
        </GridColumn>
        <GridColumn Title="@Localizer["Data.Customer"]">
            <Template Context="customerChecklist">
                @{
                    var model = customerChecklist as CustomerChecklistModel;
                    <span>@model.Customer.Name</span>
                }
            </Template>
        </GridColumn>
        <GridColumn Title="@Localizer["ChecklistsOverview.CompletedOn"]">
            <Template Context="customerChecklist">
                @{
                    var model = customerChecklist as CustomerChecklistModel;
                    @if (model.CompletedOn.HasValue)
                    {
                        <span>@model.CompletedOn.Value.ToShortDateString()</span>
                    }
                    else
                    {
                        <i>@Localizer["ChecklistsOverview.NotCompleted"]</i>
                    }
                }
            </Template>
        </GridColumn>
        <GridCommandColumn Context="customerChecklist">
            <GridCommandButton Icon="FontIcon.EditTools" OnClick="OnEditCustomerChecklistButtonClickAsync" />
            @{
                var model = customerChecklist as CustomerChecklistModel;
                if (!model.CompletedOn.HasValue)
                {
                    <GridCommandButton Icon="FontIcon.PaperPlane" OnClick="OnNavigateToCustomerChecklistButtonClickAsync" />
                }
            }
        </GridCommandColumn>
    </GridColumns>
</TelerikGrid>

This is the backing C# code for the grid:


public partial class CustomerChecklistGrid
{
    [Parameter] public int ChecklistId { get; set; }
    [Parameter] public EventCallback<CustomerChecklistModel> OnEditCustomerChecklistButtonClick { get; set; }
    [Parameter] public EventCallback<CustomerChecklistModel> OnNavigateToCustomerChecklistButtonClick { get; set; }
    [Inject] public ICustomerChecklistService CustomerChecklistService { get; set; }
    [Inject] public IStringLocalizer<SharedResources> Localizer { get; set; }
    [CascadingParameter] public Routes App { get; set; }

    private CustomerChecklistSettings _settings = new();
    private PageResult<CustomerChecklistModel> _data = new();

    private TelerikGrid<CustomerChecklistModel> _grid;

    private async void OnPageReadAsync(GridReadEventArgs args)
    {
        var newOffset = args.Request.PageSize * (args.Request.Page - 1);
        _settings.Offset = newOffset;
        _settings.CurrentPageNumber = args.Request.Page;
        var request = new CustomerChecklistRequestModel
        {
            Offset = _settings.Offset,
            Limit = _settings.Limit,
            ChecklistId = ChecklistId,
            OrderBy = _settings.OrderBy,
            IsCompleted = _settings.IsCompleted,
            CustomerId = _settings.SelectedCustomerId
        };

        _data = await CustomerChecklistService.GetPageAsync(request);
        args.Data = _data.Items;
        args.Total = _data.Total;
        StateHasChanged();
    }

    private void OnCustomerSelected(int customerId)
    {
        _settings.SelectedCustomerId = customerId;
        _settings.CurrentPageNumber = 1;
        _grid.Rebind();
    }

    private async Task OnEditCustomerChecklistButtonClickAsync(GridCommandEventArgs args)
    {
        var customerChecklist = args.Item as CustomerChecklistModel;
        if (OnEditCustomerChecklistButtonClick.HasDelegate)
        {
            await OnEditCustomerChecklistButtonClick.InvokeAsync(customerChecklist);
        }
    }

    private async Task OnNavigateToCustomerChecklistButtonClickAsync(GridCommandEventArgs args)
    {
        var customerChecklist = args.Item as CustomerChecklistModel;
        if (OnNavigateToCustomerChecklistButtonClick.HasDelegate)
        {
            await OnNavigateToCustomerChecklistButtonClick.InvokeAsync(customerChecklist);
        }
    }

    private sealed class CustomerChecklistSettings
    {
        public int Offset { get; set; }
        public int Limit { get; set; } = 25;
        public int CurrentPageNumber { get; set; } = 1;
        public int? SelectedCustomerId { get; set; }
        public bool? IsCompleted { get; set; }
        public string OrderBy { get; set; } = "customer";
    }
}

This is a screenshot of the UI I'm seeing. I'm expecting data to show up in the inner grid, data gets loaded correctly (when debugging I see data is available), however no records are shown.

Unplanned
Last Updated: 02 Jul 2024 07:52 by ADMIN

Hello, 

 

I use the scheduler component with grouping ressources on a timeline view. 

When there is only one ressource for the second group, there is no text showing on the view.

It works with 2 ressources.

I try over your demo and i have the same result.

https://blazorrepl.telerik.com/GyYAmBGE22N2CcIQ27

 

 

When I use 2 ressources it works.

Thank you

 

Need More Info
Last Updated: 28 Jun 2024 18:01 by ADMIN
Created by: Janick
Comments: 1
Category: Scheduler
Type: Feature Request
1
When the Scheduler works with a large dataset the rendering can get laggy. I need to use a rendering optimization feature such as the virtual scrolling in the Grid. 
Completed
Last Updated: 30 May 2024 12:15 by ADMIN
Release 2024 Q3 (Aug)

When I change the date while I'm in the month view, the slot doesn't change to the newly calculated ItemsPerSlot value.

To reproduce, open the calendar and set the date to the 3rd of December: REPL link.

Unplanned
Last Updated: 24 May 2024 15:09 by ADMIN
Created by: Roland
Comments: 3
Category: Scheduler
Type: Feature Request
7

I want to be able to limit the Scheduler to a minimum and/or maximum date.

---

ADMIN EDIT

---

This request could be revised in two separate tracks:

  • Min and Max parameters on component level regardless of the selected view
  • Min and Max parameters for the separate views ( Day, Week, Month etc.)

Please share your thoughts on how you'd expect it to be implemented.

Unplanned
Last Updated: 22 May 2024 11:38 by Andy
Created by: Andy
Comments: 0
Category: Scheduler
Type: Feature Request
2

Now that we can have more than 2 events in a day in Month View, we need to add an AppointmentHeight parameter to be able to make the appointments taller in height to accommodate longer titles.

 

ADMIN EDIT

An alternative for the time being is to show the longer content by using the appointment templates and the Tooltip component. For example:

https://github.com/telerik/blazor-ui/tree/master/scheduler/appointment-tooltips

Completed
Last Updated: 18 Apr 2024 13:19 by ADMIN
Release 2024 Q2 (May)
The month view only shows two events per day. I would like to be able to show more, either by increasing the height of the cell or by creating columns within the cell.
Completed
Last Updated: 04 Apr 2024 13:44 by ADMIN
Release 2024 Q2 (May)
When creating an appointment, the Start and End editors should display the date (and time) of the slot the user clicked on.
Need More Info
Last Updated: 23 Jan 2024 16:04 by ADMIN
Created by: DRASKO
Comments: 3
Category: Scheduler
Type: Bug Report
0

When adding / editing the last time slot for the day, SchedulerEditEventArgs has wrong End value.

For example Start value is 28.12.2023. 23:30:00 and end value is 28.12.2023. 00:00:00. Should instead be 28.12.2023. 23:59:59 or 29.12.2023. 00:00:00.

 

Completed
Last Updated: 04 Jan 2024 07:46 by ADMIN
Release 5.1.0 (31 Jan 2024) (R1 2024)

Hello!

After update to 2.27 there is a bug to scheduler with number of days and refresh.

You can check your live demo also:

https://demos.telerik.com/blazor-ui/scheduler/multiday-view

Completed
Last Updated: 04 Jan 2024 07:46 by ADMIN
Release 5.1.0 (31 Jan 2024) (R1 2024)

In a Scheduler with vertical grouping, I am dynamically changing the displayed resources during runtime. It looks like displaying a longer resource name breaks the rendering.

The Scheduler does not recalculate the cell width when changing the resource list.

---

ADMIN EDIT

---

Possible workarounds:

  1. Force component rerendering when changing the resources list - dispose it and initialize it again using a flag and conditional rendering. Example: https://blazorrepl.telerik.com/wwuDGLvE42TUf5En09.

  2. Use CSS to set appropriate min-width to the resource cell, so it is wide enough to fit the longest name of the available resources. Example: https://blazorrepl.telerik.com/wmaDGhFY37t5pFj757.
Unplanned
Last Updated: 21 Dec 2023 14:50 by ADMIN

When using Vertical Grouping by multiple resources and Timeline View, the group rows without appointments do not have min-height as the rest of the group rows. Thus, they appear shorter which causes an offset of the events on the next rows.

Steps to reproduce:

  1. Load Timeline View Demo
  2. Delete Charlie's event in Small meeting room

===

ADMIN EDIT

===

A possible workaround for the time being is to set min-height to all rows. Apply this style only when Timeline view is selected, so this does not break the rendering of the other views.

Example: https://blazorrepl.telerik.com/mHYmwsOt30fjTZ6a32.

 

Unplanned
Last Updated: 07 Dec 2023 16:36 by Daren
Created by: Neil
Comments: 6
Category: Scheduler
Type: Feature Request
15

I want to hide the 'All Day slot'  - I don't want to offer this functionality.

At the moment, you could try CSS like this, but ideally this would be a parameter (maybe on the view):

 

        .no-allday .k-scheduler-head .k-scheduler-group:last-child{
            display:none;
        }

    <div class="no-allday">
        <TelerikScheduler Data="@Appointments" @bind-Date="@StartDate" @bind-View="@CurrView" Height="600px" Width="800px">
            <SchedulerViews>
                <SchedulerDayView StartTime="@DayStart" />
                <SchedulerWeekView StartTime="@DayStart" />
                <SchedulerMultiDayView StartTime="@DayStart" NumberOfDays="10" />
            </SchedulerViews>
        </TelerikScheduler>
    </div>

Unplanned
Last Updated: 03 Nov 2023 14:52 by Scott

I am using a Scheduler with vertical grouping by multiple resources. In Timeline view, some of the appointments appear with an offset and are not correctly aligned in the cell. In some cases, the appointment is even rendered outside the slot it is associated with.

The issue seems to occur as of UI for Blazor 4.2.0. The same configuration worked fine in 4.1.0.

Unplanned
Last Updated: 30 Oct 2023 11:00 by Jack

I am using the Scheduler component in Telerik for Blazor and am getting an intermittent exception being thrown, usually when navigating quickly through the application (ie. navigating to another page before the initial page containing the Scheduler has finished rendering).

This is the exception received:

===

ADMIN EDIT

===

The Scheduler must render in the browser and then it measures and adjusts its layout with JavaScript. You may hit this error if the component is disposed before or during this JavaScript call.

Example use cases:

  • Navigating to a different page before the full component initialization

    Workaround: 

    The possibility to hit that is higher in case the Scheduler needs more time to initialize (e.g. it has to render a large set of appointments). In such a scenario, it will be useful to optimize the time needed for loading the appointments, so that the initial component rendering is not blocked by waiting all the data. For that purpose, you may load the appointments on demand - not fetching all possible appointments at once, but only when the user should see them. An example of such an implementation you may find here: https://github.com/telerik/blazor-ui/tree/master/scheduler/load-appointments-on-demand.

  • Disposing the component during runtime (e.g. depending on the screen size)https://blazorrepl.telerik.com/wIuHliEt40SutaBI53.

    Workaround: 

    Potential solution in this case - render component after calculating the screen size: https://blazorrepl.telerik.com/coEnPWON4570Wna007.
Completed
Last Updated: 17 Oct 2023 11:27 by ADMIN
Release 5.0.0 (15 Nov 2023) (R1 PI1)
The Start and End properties provide only the dates but not the time. 
Unplanned
Last Updated: 17 Oct 2023 01:08 by Paul

I am really looking to try to do something like this in Blazor: ASP.NET MVC Scheduler Hierarchical Grouping Demo | Telerik UI for ASP.NET MVC

In MVC, this feature is implemented with the dataParentValueField.

Completed
Last Updated: 16 Oct 2023 22:27 by Paul
Release 3.7.0 (09 Nov 2022)
I need some help with my question about how to know what grouping resource was clicked on. I'm using a custom editing screen that is triggered when the OnEdit event fires. I can't figure out how to get resource ID when the event fires. How do I get the resource group information on an event that fires with IsNew=true?
Unplanned
Last Updated: 10 Oct 2023 09:31 by Jack

Check the following configuration: https://blazorrepl.telerik.com/cHvuPOYX27peykXr18 ( SlotDuration="720"  SlotDivisions="1").

The start time of the appointment is 12:00 PM today. The Scheduler, however, displays the start at 12:00 AM on the next day even though the arrow indicates the event continues from the previous day.

For reference, if I set SlotDivisions="2", I get the expected result: https://blazorrepl.telerik.com/GxFOvYED302CzPCo32.

1 2 3 4 5 6