Description

Regression introduced in version 10.0.0. The TimePicker's value must be null initially and the system time should be at least 55 minutes past the hour (e.g., 13:55 or 14:57).

Steps To Reproduce

1. Set the time on your machine to 55 past the hour, e.g., 13:55.
2. Open a new instance of Chrome and navigate to https://blazorrepl.telerik.com/mpFEYBOi12ooskUK19
3. Run the example
4. Click in the clock icon in the picker, to open its dropdown.
5. Click the Set button.

Actual Behavior

The following error is thrown:

Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: Hour, Minute, and Second parameters describe an un-representable DateTime.
System.ArgumentOutOfRangeException: Hour, Minute, and Second parameters describe an un-representable DateTime.

Expected Behavior

No error is thrown and the time that is automatically highlighted in the dropdown is set, after clicking the "Set" button.

Browser

All

Last working version of Telerik UI for Blazor (if regression)

9.1.0

The PivotGrid layout and cell alignment break when filtering expanded child columns by a value that exists only in some of the columns.

Here is a test page:

1. Expand 2024 and 2025.
2. Filter Month by a month name, which exists only in on the of two years. At the time of writing, this is "November".
3. Observe how the first cell in the header row has a larger colspan (2 instead of 1), so the header cells are misaligned with the data cells.

<TelerikPivotGridContainer>
    <TelerikPivotGridConfiguratorButton></TelerikPivotGridConfiguratorButton>
    <TelerikPivotGridConfigurator></TelerikPivotGridConfigurator>
        <TelerikPivotGrid Data="@PivotGridData" DataProviderType="@PivotGridDataProviderType.Local"
                          @ref="PivotGridRef" ColumnHeadersWidth="100px" RowHeadersWidth="130px">
            <ColumnHeaderTemplate>
                @{
                    var ctx = (PivotGridColumnHeaderTemplateContext)context;
                    int underscoreIndex = ctx.Text.IndexOf("-");
                    string text = ctx.Text;
                    if (underscoreIndex > 0)
                    {
                        text = text.Replace(text.Substring(0, underscoreIndex + 1), "");
                        <span>@text</span>
                    }
                    else
                    {
                        <span>@ctx.Text</span>
                    }
                }
            </ColumnHeaderTemplate>

            <DataCellTemplate Context="dataCellContext">
                @{
                    var c = (PivotGridDataCellTemplateContext)dataCellContext;
                    var amt = c.Value == null ? (0m).ToString("C2") : ((decimal)c.Value).ToString("C2");
                }
                <div style="text-align: right;">
                    @amt
                </div>
            </DataCellTemplate>

            <PivotGridRows>
                <PivotGridRow Name="@nameof(PivotGridModel.Station)" Title="Station" />
            </PivotGridRows>

            <PivotGridColumns>
                <PivotGridColumn Name="@nameof(PivotGridModel.Year)" Title="Year" HeaderClass="year-header" />
                <PivotGridColumn Name="@nameof(PivotGridModel.MonthName)" Title="Month" />
            </PivotGridColumns>

            <PivotGridMeasures>
                <PivotGridMeasure Name="@nameof(PivotGridModel.Rate)" Title="Total"
                                  Aggregate="@PivotGridAggregateType.Sum" />
            </PivotGridMeasures>
        </TelerikPivotGrid>
</TelerikPivotGridContainer>

@code
{
    private TelerikPivotGrid<PivotGridModel>? PivotGridRef { get; set; }

    private List<PivotGridModel> PivotGridData { get; set; } = new();

    protected override async Task OnInitializedAsync()
    {
        var dataItemCount = 10000;
        var stationCount = 30;
        var rnd = Random.Shared;

        for (int i = 1; i <= dataItemCount; i++)
        {
            var stationNumber = rnd.Next(1, stationCount);

            PivotGridData.Add(new PivotGridModel()
            {
                Station = $"Station {stationNumber}",
                ContractMonth = DateTime.Today.AddMonths(-rnd.Next(0, 13)),
                Rate = rnd.Next(123, 987) * 1.23m
            });
        }

        PivotGridRef?.Rebind();

        await base.OnInitializedAsync();
    }

    public class PivotGridModel
    {
        public DateTime ContractMonth { get; set; }
        public int Year => ContractMonth.Year;
        public int Month => ContractMonth.Month;
        public string MonthName => $"{Month}-{ContractMonth.ToString("MMMM")}";
        public string Station { get; set; } = string.Empty;
        public decimal? Rate { get; set; }
    }
}

Description

Affected components: those inheriting from TelerikInputBase (e.g., TelerikDatePicker). When an exception is thrown inside an async Task event handler for the OnChange, OnBlur, OnOpen, and ValueChanged events, the exception is completely and silently swallowed. The exception is not caught by ErrorBoundary.

Related: #6333, #12364

Steps To Reproduce

1. Use a standard ErrorBoundary in MainLayout.razor.

<ErrorBoundary>
    <ChildContent>
        @Body
    </ChildContent>
    <ErrorContent>
        <p class="error">An unhandled error has occurred.</p>
    </ErrorContent>
</ErrorBoundary>

2. Declare a TelerikDatePicker and bind an async Task method to the ValueChanged or OnChange event.

<TelerikDatePicker Value="@DatePickerValue"
                   ValueChanged="@((DateTime inputDate) => OnDatePickerValueChanged(inputDate))">
</TelerikDatePicker>


<TelerikButton OnClick="@(() => throw new Exception("Exception from button"))">Click to test ErrorBoundary</TelerikButton>

@code {
    private DateTime DatePickerValue { get; set; } = DateTime.Today;

    private async Task OnDatePickerValueChanged(DateTime newValue)
    {
        throw new InvalidOperationException("This exception should be caught by the ErrorBoundary!");
    }
}

3. Run the page and select a date in the DatePicker.

Actual Behavior

The exception thrown in the OnDatePickerValueChanged event handler is not caught by ErrorBoundary.

Expected Behavior

The exception thrown in the OnDatePickerValueChanged event handler is caught by ErrorBoundary.

Browser

All

Last working version of Telerik UI for Blazor (if regression)

No response

Description

Affected components: those inheriting from TelerikSelectBase (e.g., TelerikDropDownList, TelerikComboBox, TelerikMultiSelect, TelerikAutoComplete). When an exception is thrown inside an async Task event handler for the OnChange, OnBlur, OnOpen, and ValueChanged events, the exception is completely and silently swallowed. The exception is not caught by ErrorBoundary.

Related: #6333

Steps To Reproduce

Steps to Reproduce

1. Use a standard ErrorBoundary in MainLayout.razor.

<ErrorBoundary>
    <ChildContent>
        @Body
    </ChildContent>
    <ErrorContent>
        <p class="error">An unhandled error has occurred.</p>
    </ErrorContent>
</ErrorBoundary>

2. Declare a TelerikDropDownList and bind an async Task method to the ValueChanged or OnChange event.

<TelerikDropDownList 
    Data="@DropDownData"                  
    ValueChanged="@( (int newValue) => OnDropDownValueChanged(newValue))"       
    TextField="@nameof(TestItem.Name)"
    ValueField="@nameof(TestItem.Id)" />

<TelerikButton OnClick="@(() => throw new Exception("Exception from button"))">Click to test ErrorBoundary</TelerikButton>

@code {
    private int? SelectedDropDownValue;

    private List<TestItem> DropDownData = new()
    {
        new() { Id = 1, Name = "Select me to throw exception" },
    };

    private async Task OnDropDownValueChanged(int newValue)
    {
        throw new InvalidOperationException("This exception should be caught by the ErrorBoundary!");
    }

    public class TestItem
    {
        public int Id { get; set; }
        public string Name { get; set; } = string.Empty;
    }
}

3. Run the page and select the item in the DropDownList's list.

Actual Behavior

The exception thrown in the OnDropDownValueChanged event handler is not caught by ErrorBoundary.

Expected Behavior

The exception thrown in the OnDropDownValueChanged event handler is caught by ErrorBoundary.

Browser

All

Last working version of Telerik UI for Blazor (if regression)

No response

Telerik UI for Blazor requires unsafe-inline styles in order to render style attributes from the .NET runtime.

Please add support for strict CSS CSP without the need for unsafe inline styles.

===

TELERIK EDIT:

Due to the complexity and required effort to add strict CSS CSP support:

• The feature request must gather enough votes.
• We may implement it gradually. That's why, everyone who is interested, please specify the exact components and features that you need to be compliant sooner.

Do you have a planned date for Telerik UI for Blazor to fully support Visual Studio 2022 Professional?

Telerik UI for Blazor cannot be used with Visual Studio 2022 Professional in Debug mode and Hot Reload. There are couple issues, see below, that seems to be related, and that Telerik are not willing to fix. Those issues render Telerik UI for Blazor unusable when working with Visual Studio 2022 Professional with Hot Reload.

Predefined dialogs are not shown after hot reload updates are applied and Predefined dialogs throw when hot reload updates are applied

Blazor WASM breaks in VS2022 after Hot Reload in UI for Blazor | Telerik Forums

Hi !

I tried using the combobox but, since my datasource is too big and I need grouping, therefore virtualization is not possible, I need to do the filtering on the server side, using the OnRead method to fetch my data based on what the user has entered in the input field. The problem is that the client side filtering is always active and I can't reproduce the same type of filtering I do server side on the client side and I lose some results. I think it would be really nice if we could specify to not filter client side or something like that, to give us more control.

Thank you very much !

The issue can be reproduced when clicking on a button that opens a predefined Dialog, then making some changes on the page and hot reloading. In this scenario, I get the following error:

Microsoft.JSInterop.JSException: Cannot read properties of null (reading 'addEventListener')
TypeError: Cannot read properties of null (reading 'addEventListener')

A Grid component with GridToolBar increases memory usage due to event handler leaks, specifically associated with the GridToolBar and ColumnMenuToolBar.

It would be nice to be able to customize the comparer used to display data in a specific order.

I think by default it uses a simple alphabetic comparison

But we have a lot of data using alpha and numeric information like:

• Label1
• Label2
• ...
• Label100

And the user wants data in the numeric order, so we often implement our own comparer everywhere for it to work.

The PivotGrid doesn't seem to provide a way to customize the order of data even with a provider Local, ordering the source in a specific way before giving it to the component doesn't work either.

Thanks
Thomas