Is it possible to allow the adding of aria-label, aria-labelledby, and aria-describedby to the TelerikForm element?

I noticed that aria-labelledby and aria-describedby were added to input elements here: https://feedback.telerik.com/blazor/1531788-allow-setting-aria-labelledby-and-aria-describedby-attributes-to-the-telerik-inputs - so I assume they could be added to TelerikForm too?

Currently, there doesn't seem to be a way to add those attributes, whereas with the default EditForm we can, and so we're unable to leverage the TelerikForm if we want to provide better descriptive information to non-sighted users with a label and description of the form.

Ideally, we should be able to render any HTML element with global attributes: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes , which would include any of the aria-* tags.

I understand there's a desire to have a locked-down API for components and not allow arbitrary attributes, but I think certain attributes core to accessibility the users of the library should have some ability to manipulate.

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.

https://docs.telerik.com/blazor-ui/common-features/icons#icon-nuget-packages

When you click "Preview" under Using TelerikFontIcon, the preview is blank, even if I scroll to the top, still nothing.

Hi Support Team,

in our project we are using Telerik Chart and has required to update theme of chart from dark to light and light to dark.

telerik chart in child razor page and dark/light button in mainlayout.razor file but telerik chart updating theme when click on button exist telerik chart razor page. as below link  it is an existing issue. 

https://feedback.telerik.com/blazor/1496389-using-custom-themes-changing-at-runtime-does-not-change-the-chart-component-style

please advice how to resolve the issue.

Create a word style component.

Currently my wpf desktop app uses a editor style component and refreshes a crystal reports window component to show edits made to a pre created document. We use this to create quote letters using custom legal jargon.

I am in the process of moving that program to Blazor. A word component that i can wrap our custom texts around and buttons in the title bar for pasting our prefomatted text would be so much better than our current setup. 

Could this be added to the roadmap? 

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

If the Datepicker's binded value is a DateOnly type, the Min and Max should follow that type.

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.

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.

https://dynamic-linq.net/

Please consider refactoring Telerik.DataSource to allow for Dynamic Linq expressions rather than fixed Member.

1. You don't have to reinvent the wheel in creating lambda expressions. You can simplify Telerik.DataSource code to just use Dynamic Linq.

2. Allows support for Sorts & Grouping to be expressions such as "Math.Abs(field ?? 0)" rather than just "field".

We have edit dialogs with editable fields on them, and we want to display a confirmation dialog if the user tries to close the edit dialog without saving. Simplified code to illustrate the issue: 

https://blazorrepl.telerik.com/GIEwwBvM54V6RbH952 

Sometimes we need custom filter logic. 

The advised approach currently is to use the OnRead event and have to manage the fetching of data manually  https://docs.telerik.com/blazor-ui/components/grid/manual-operations

If we could set a column to use a filter function  that has Func<GridDataType, Bool>? then we could apply this complex filter without having to repeatedly query the database and apply filters server side. 

For example, if I wanted to filter a column that related to an object that had a property that was a Collection<T> I could check the values of this collection against a filter UI I have made somewhere in the grid or outside of it. Then when the columns filterdescriptior was reviewed it would check my Func which returned True if any of the Rows Collection<T> matched my custom filter UI options.

Example use case that this feature would allow; 

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

Hi,

I haven't been able to find this as a request or as a topic of discussion (If it iss feel free to point me to it and close this request) but I feel the Grouping feature is limiting. If I use the group field in say the DropDownList the grouping works fine but it orders it alphabetically.

I propose adding a number of features to enhance this. The first being a GroupAscending or GroupDescending tag. Takes a boolean value and allows you to change the order to ascending (default/True) or descending (False).

The second, and more complicated feature upgrade could be a GroupOrder tag. This would take a List of the group field names ordered in the way you require and apply that order to the grouping in the DropDownList. for instance if you had the list ordered as Category 1, Category 3, Category 2 it would display the items in each grouping in that order top to bottom.

Regards,

Luke

Hi,
I have a little problem with changing the LoadGroupsOnDemand value. Depending on the data in my grid, I set this value to true or false. When updating grid data requires changing the LoadGroupsOnDemand value, I can't do it this way:

LoadGroupsOnDemand = true;
GridData = result;
GridRef.SetStateAsync(GridRef.GetState());

This code throws me an exception.
I need to do something like this to make it work:

LoadGroupsOnDemand = true;
GridRef.LoadGroupsOnDemand = LoadGroupsOnDemand;
GridData = result;
GridRef.SetStateAsync(GridRef.GetState());

This is the code that is executed in onclick. After OnRead is executed, the exception is thrown.

Let me know if you need more information.

See below repl

https://blazorrepl.telerik.com/GeYodYvp135zJH7N22

The first dropdown is populated correctly, it is not in a FormItem or Template

The second one, populated in the same way but inside a FormItem context does not show the data, it only redraws and shows data when entering another control i.e. the other working dropdown.

This was previously working when the application was using .net 6 and Telerik 3.6.1
It has since been updated to .net 8 and Telerik 5.1.1

What is the correct way to populate this?
Can you provide more information?

Thanks.