Using Microsoft Visual Studio Professional 2022 (64-bit) - Current Version 17.11.0

Trying to create a new Telerik for Blazor project using Telerik C# Blazor Application Template.

Visual Studio freezes after I Name the project and click create. Only way to exit out of Visual Studio is to kill it through task manager.

Trying your project walk through for Blazor, RpsTrackingBlazor, After I add the nuget packages and try to add the using statement to _imports.razor as in the tutorial I get the error that the type or namespace name telerik could not be found.

Your project uses <TargetFramework>netcoreapp3.1</TargetFramework>

I also tried framework net8.0

Hi Telerik Team,

when using the (currently) latest versions of VS (17.11.0) and Blazor 8.0.8 runtimes (and custom css theme version 8.2.0) I get the following error when running my project in debug mode:

TypeError: Cannot read properties of null (reading 'classList')
Stapelüberwachung:
 >  at e.addClass (https://localhost:7038/_content/Telerik.UI.for.Blazor/js/telerik-blazor.js:50:1122923)
 >    at v.resetCallout (https://localhost:7038/_content/Telerik.UI.for.Blazor/js/telerik-blazor.js:50:1372516)
 >    at v.adjustCalloutPosition (https://localhost:7038/_content/Telerik.UI.for.Blazor/js/telerik-blazor.js:50:1372355)
 >    at e.invokeComponentMethod (https://localhost:7038/_content/Telerik.UI.for.Blazor/js/telerik-blazor.js:50:1112736)
 >    at https://localhost:7038/_framework/blazor.webassembly.js:1:2878
 >    at new Promise (<anonymous>)
 >    at b.beginInvokeJSFromDotNet (https://localhost:7038/_framework/blazor.webassembly.js:1:2835)
 >    at Object.vn [as invokeJSJson] (https://localhost:7038/_framework/blazor.webassembly.js:1:58849)
 >    at https://localhost:7038/_framework/dotnet.runtime.8.0.8.80cvijctdx.js:3:178428
 >    at Ll (https://localhost:7038/_framework/dotnet.runtime.8.0.8.80cvijctdx.js:3:179262)

It looks like the problem has something to do with a function that wants to set the css "k-callout-e" class to some object.
The problem appears in js when e is null in the following method:
e.classList.add(t)

In this case e = null and t = "k-callout-e". It seems there's no null check for e and VS 2022 reports the problem.

The debugger in VS cannot be disabled for js content as it seems it's the same debugger for Blazor itself.
When hitting F5 to continue multiple times the projects keeps running until it hits the same problem again.

In my project I added a single "TelerikTooltip" component for Tooltips. I tried disabling it but still the same problem.
Maybe the js code is used for some other component.

If you need more information just let me know.

Regards,
Tom

Hi.

I love the slider control, but I'd love it even more if it had an option to "snap back to 0" when released. So while the user is clicking/tapping and holding, it updates the value, but when released it goes back to 0. Another option would be to have a boolean property "IsPressed" where you could control this yourself. Or a callback, of course. I looked at extending the source myself, but most of the logic is in the javascript and I'd really rather not. :)

Say hi to Ed.

Best regards,
Eric Johansson
Telerik Champion

PS: Having a Devcraft Ultimate license still gives you a warning about not having a license for the product (UI for Blazor) on this page(the feature request form page).

With
<TelerikNumericTextBox @bind-Value="myValue" Format="C" SelectOnFocus="true">
the content of the input is not selected upon focussing.  Without the Format="C" it is.

I would like to be able to set the Id on any Blazor component for automated testing purposes.

---

ADMIN EDIT

If you need something different than automated testing selectors, please add your use case in the comments.

For automated testing, you can cascade selectors through a parent element (e.g., a div or span) that has the desired attributes (be that id, class, some data-* attribute, etc.). Adding ID parameters to Blazor components can easily make them brittle because they can be repeated and included in arbitrary hierarchy easily - that's the core concept of a razor component - so such IDs need to be unique, which defeats the predictability you will need for testing.

If you are interested in testing with Selenium, you may find useful this request: https://feedback.telerik.com/blazor/1513117-translators-for-selenium-testing-for-the-telerik-ui-for-blazor-components. If so, Vote for it and Follow it so we can know there is interest, and so you can get status updates.

You can also Follow a separate enhancement for the Grid Command buttons here : https://feedback.telerik.com/blazor/1463164-id-attribute-on-buttons-telerikbuttons-gridcommandbuttons-etc

---

The current privot grid is a good start, but it is missing some key features.

1. Being able to resize columns
2. Have custom column and row header/footers
3. Export to excel

For reasons unknown, our TelerikGrid rows all render with each <tr> element having the "k-alt k-table-alt-row" classes associated with them. This causes the background colour for each row to be the same, rather than alternating between two colours.

For example, the following block of code...

<TelerikGrid Id="@(Utility.CleanCssId("CrewGrid"))"
                 DetailTemplate="GridDetailTemplate"
                 EnableLoaderContainer="@ShowLoading"
                 Groupable="false"
                 Height="100%"
                 OnRead="@OnGridRead"
                 OnStateChanged="@OnGridStateChanged"
                 OnStateInit="@OnGridStateInit"
                 Pageable="true"
                 PageSize="@PageSize"
                 PageSizeChanged="@OnGridPageSizeChanged"
                 Reorderable="IsLargeScreen"
                 Resizable="IsLargeScreen"
                 SelectionMode="GridSelectionMode.Single"
                 ShowColumnMenu="IsLargeScreen"
                 Size="@GetGridSize"
                 Sortable="true"
                 SortMode="SortMode.Multiple"
                 TItem="CrewListItem"
                 @ref="Grid"
                 @bind-SelectedItems="@SelectedItems"
                 OnRowRender="OnRowRender">
    <NoDataTemplate>
        <strong>@RecordsMessage</strong>
    </NoDataTemplate>
    <GridSettings>
        <GridColumnMenuSettings Lockable="false" FilterMode="ColumnMenuFilterMode.None" />
        <GridPagerSettings InputType="PagerInputType.Buttons" PageSizes="@PageSizes" ButtonCount="5" Adaptive="false" Position="PagerPosition.Bottom" />
    </GridSettings>
    <GridColumns>
        <GridColumn Field="@nameof(CrewListItem.Color)"
                    Width="@(IsLargeScreen ? "40px" : "50px")"
                    Resizable="false"
                    ShowColumnMenu="false"
                    Groupable="false"
                    ShowColumnChooser="false"
                    Sortable="false"
                    HeaderClass="k-text-transparent"
                    OnCellRender="OnGridCellRender">
            <Template>
                @{
                    var item = (CrewListItem)context;
                    <M360ListColumnColor Color="@item.Color" IsLargeScreen="IsLargeScreen" />
                }
            </Template>
        </GridColumn>
        <GridColumn Field="@nameof(CrewListItem.Name)" Title="@TMessages.Crew" OnCellRender="OnGridCellRender" VisibleInColumnChooser="false">
            <Template>
                @{
                    var item = (CrewListItem)context;
                    <div class="k-d-flex k-h-full @(IsLargeScreen ? "k-align-items-stretch" : "k-align-items-center")">
                        <M360ListColumnLink Url="@string.Concat("crew/", item.Id)" Text="@item.Name" EntityType="Crew" IsPrimary="true" />
                    </div>
                }
            </Template>
        </GridColumn>
        <GridColumn Field="@nameof(CrewListItem.DivisionsJson)" Title="Division(s)" Sortable="true" Visible="IsLargeScreen" OnCellRender="OnGridCellRender">
            <Template>
                @{
                    var item = (CrewListItem)context;
                    <M360ListColumnList Items="@item.Divisions.ToList()" />
                }
            </Template>
        </GridColumn>
         .
         .
         .
    </GridColumns>
</TelerikGrid>

...results in markup like this...

<tbody class="k-table-tbody" role="rowgroup">
  <tr
    role="row"
    class="k-master-row k-table-row k-alt k-table-alt-row"
    data-render-row-index="0"
    aria-rowindex="1"
  >
    . . .
  </tr>
  <tr
    role="row"
    class="k-master-row k-table-row k-alt k-table-alt-row"
    data-render-row-index="1"
    aria-rowindex="3"
  >
    . . .
  </tr>
  <tr
    role="row"
    class="k-master-row k-table-row k-alt k-table-alt-row"
    data-render-row-index="2"
    aria-rowindex="5"
  >
    . . .
  </tr>
  . . .
</tbody>

I can see that the "aria-rowindex" increments by two, yet the "data-render-row-index" increments by one. Are we missing something simple, yet crucial here? What could cause the skipping of rows during render?

Many thanks,

Nem

I use TelerikMultiSelect as a component for custom filter:

<FilterMenuTemplate>
    <TelerikMultiSelect Value="@(AlreadySelectedFilterValues(context.FilterDescriptor))"
                        OnRead="@OnReadWrapper"
                        ValueMapper="@ValueMapperWrapper"
                        TItem="@FilterItemDto" 
                        TValue="@TFilterValue"
                        ValueField="@nameof(FilterItemDto.Id)"
                        TextField="@nameof(FilterItemDto.Name)"
                        AutoClose="true"
                        Filterable="true"
                        ClearButton="true"
                        DebounceDelay="500"
                        OnChange="@((object newValue) => OnMenuFilterChange(newValue, context))"/>
</FilterMenuTemplate>

Trying to render already selected filters gives two "magic" items in context.FilterDescriptor in AlreadySelectedFilterValues:

These items appear only if TelerikMultiSelect is empty. If I select some from MultySelect these two items disappear and everything works as expected.

GridState has an empty list of FilterDescriptos.
AggregatedAccountNames - string? column.
TFilterValues can be int, int? or string, no matter, the same behavior.
TFilterItemDto - class with int? Id and and string Name fields.

As expected value I expect to have empty FilterDescriptos if nothing was selected.

Hi,

As the subject says, when our app is on the Chinese localization `zh-CN` it causes the date picker to default. 

By default I mean the default date becomes 01 01 0001 and you cannot change it no matter what you select.

On any of our other localizations such as es-ES, en-US, fr-FR, etc. (zh-CN is the only one is what I'm getting at) we don't get this issue.

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.

We have a form with multiple TelerikEditor controls bound via @bind-value. The issue arises when there are more than 2 TelerikEditors; the performance is significantly impacted for all input fields. Typing experiences delays, making fast typing impractical.

This performance degradation is attributed to the fact that the page undergoes frequent re-renders when typing into the input fields. Interestingly, this behavior does not occur when TelerikEditor is excluded from the form or page.

While the DebounceDelay property in TelerikEditor helps improve its performance, it does not extend its influence to other input fields in the form or page. Are you familiar with this issue, and do you have any recommendations for addressing or mitigating it?

Using:
WebAssembly
Telerik 4.0.1

Hi,

When I use TelerikDatePicker in my own component and the I use this component in Form, the validation for this input on the UI side doesn't work. The k-invalid class is not added, the appriopriate aria-invalid value is not set. The value on the TelerikDataPicker CascadedEditContext side is ok, an error message for this field appears after validation.

Please add the option for the Multiselect to filter the same way the DropDownList does. It's very odd & confusing for end users (and bad UX) in a UI toolkit for similar controls to do things in different ways. Can you please add the ability for the Multiselect control to filter items in the popup window the same way the DropDownList does with the nice filter text box.