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.

Are you thinking about developing an app builder for Blazor to create a project and add telerik component and finally export it as Blazor app (server or wasm)?

(like this one develop from Infragistics https://appbuilder.indigo.design/app/)
This tool export every single page as razor page.

BR,

Flavio

I often have the scenario where I need to switch from the autogenerated formitem to a templated version. Mostly because I need a different editor

For example:

<FormItem Field="@nameof(KeyValuesViewModel.Workplace)" LabelText="Workplace" EditorType="@FormEditorType.TextBox"/>

I create something like this:

            <FormItem>
                <Template>
                    <label for="WorkplaceInput">Workplace</label>
                    <TelerikMaskedTextBox Id="WorkplaceInput" Mask="aa aaaaaa" Enabled=@WorkplaceEnabled OnChange="OnWorkplaceChanged" @ref=@WorkplaceTextBoxRef />
                    <TelerikValidationMessage For="@(() => KeyValuesViewModel.Workplace)" />
                </Template>
            </FormItem>

It would speed up things if I just could use the "light bulb" and convert it. Instead coding it manually, copy, paste, edit the copied version. Over and over again.

Grid with columns price1 and price2. Enter value in price1, switch to price2, enter value there, and editor is set to old value after async events finish.

The value entered in price2 is correctly set to the property, but the editor reverts to the previous value. If you escape edit mode of the cell, the value entered before the events finish will be shown.

On (fast) tabbing and entering values, this removes the first values entered before the async background events finish.

I tried reproducing the problem in REPL, but could not get the exact same behaviour. In our case no specific value is being set to price2, it just reverts.

https://blazorrepl.telerik.com/cxEzvQvE52q8aaAi27

How would you approach preventing the editor from being overridden by other cells' delayed events?

Filter option switch back to default option (Contains) after entering value in the textbox. 

Example - 

- screenshot-1 - Select from filter option - Startswith ; Then, enter value in text box.

- screenshot -2 - After user enter first character , atomically filter option switch back to Contains (from startswith).  

Good Day,

I really like the ability to drag and drop between controls. I though feel very limited, by Telerik enforcing both controls to have the same underlying data model (or interface) as per this article.

How to Drag and Drop Different Models between Multiple Grids - Telerik UI for Blazor

What would really be great, if the "OnRowDrop" event could accept other data models. I have no particular view on how exactly this should be implemented. It should work for server and WASM environments.

An example could be, that the "dragged" row is of type object and not <TItem> and it is left to implementation code deal with different data models being dropped on the control.

        //Something like this

        private void OnRowDropHandler(GridRowDropEventArgs args)

        {
            if(args.Item is IParentSampleData)
            {
                GridData1.Remove((IParentSampleData)args.Item);
                InsertItem((IParentSampleData)args);
            }
            else if (args.Item is SomeOtherModel)
            { 
                 //Whatever is needed...
            }
        }

Kind regards,

Peter

When I click on any item from the SplitButton dropdown list, it closes, until I release the key

I am creating a wrapper over the TelerikNumericTextBox component so that it works with all numeric data types (such as int, decimal, double, etc). I have added custom parameters for the Min and Max, and if they are not explicitly set I would like them to default to T.MinValue and T.MaxValue respectively. 

Hi,

I am getting the following error message when trying to upgrade from 3.6.1 to 3.7.0. I tried multiple times without success.

===========================================================

An error occurred while running the wizard.

Error executing custom action Telerik.Blazor.VSX.Actions.MultiProjectUpdateMasterPageAction: System.InvalidOperationException: Sequence contains no matching element
   at System.Linq.Enumerable.First[TSource](IEnumerable`1 source, Func`2 predicate)
   at Telerik.Blazor.VSX.Actions.AdvancedUpdateMasterPageAction.RetrieveMasterPageSettingsUpgradeInfo(IPropertyDataDictionary arguments, IProjectWrap project)
   at Telerik.Blazor.VSX.Actions.UpdateMasterPageAction.Execute(WizardContext wizardContext, IPropertyDataDictionary arguments, IProjectWrap projectWrap)
   at Telerik.VSX.Actions.MultiProjectActionBase`1.Execute(WizardContext wizardContext, IPropertyDataDictionary arguments)
   at Telerik.VSX.WizardEngine.ActionManager.ExecActions()

===========================================================

Thank you

Joe Walsh