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.

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.

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).  

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

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

After installing Telerik UI (for WPF and BLAZOR) - the Intellisense / Autocompleter stopped working in Visual Studio 2022 17.4.2

https://www.youtube.com/watch?v=6Fn5C726h4U

Enter and Tab no longer inserts the snippet. 

After uninstalling Telerik UI from Windows, the Intellisense / AutoCompleter started working again !

Team,

Currently I am using Telerik UI Blazor with 3.7.0 version, few cases and intermittently TooltipShowEvent.Click is not working and tooltip is not getting displayed and unable to find root cause for it.

Could you please assist what is causing for this behaviour and feasible solution?

Below is sample code snippet where we use 3 tabs

<TelerikTabStrip Class="tmGraphTabStrip" ActiveTabIndex="@ActiveTab" ActiveTabIndexChanged="@ActiveTabChanged" @ref="@TabRef">
@for (var i = 0; i < 4; i++)
 {
<TabStripTab Title="@TabName" Class="tmTabHeaderCellStyle">
<TelerikGridLayout RowSpacing="20px" ColumnSpacing="1px" Class="grid-CardlayoutNew">
@*
display data in gridlayout structure for each row/column along with tooltip, we are able to see div selector and target selector Ids from Dev Tools browser
*@
</TelerikGridLayout>
</TabStripTab>
}
</TelerikTabStrip>

Ex:

<TelerikTooltip TargetSelector="@ToolTipCurselector" ShowOn="@TooltipShowEvent.Click" Position="TooltipPosition.Top">
</TelerikTooltip>

After upgrading to Telerik Version 3.6.1 my CSS is messed up on my grids, the pagers look like the image below.

Can the dev team comment on any known reasons why Charts (I think both SVG and Canvas) might not display when a blazor page is rendered from an automation tool like Chromium, Puppeteer, etc.? (e.g., https://developers.google.com/web/tools/puppeteer).

I have a standard blazor page that I can manually from a standard Chrome window, and it works fine and the Telerik chart displays.

But the same page, when launched either headless or with a GUI browser window, from a tool like Chromium or Puppeteer (with javascript enabled of course), it seems like the DOM is never dynamically updated to include the chart.

Hi, we are using a tile layout for charts and are having an issue where the tooltips for the second row of tiles are appearing at the bottom of the screen away from the chart or not at all. Then when we scroll back to the first row of tiles the tool tips are out of alignment as well. The following screen shot shows an example.

We have a component that has a tab strip and the tile layout with the following code

<TabStripTab Title="@tabName">
	@((MarkupString)tabHeading)
				
	<TelerikTileLayout Columns="6"
						RowHeight="225px"
						ColumnWidth="285px"
						Reorderable="true"
						Resizable="true"
						OnResize="@ItemResize"
						OnReorder="@ItemReorder"
						@ref="@TileLayout">
		<TileLayoutItems>
			@foreach (CustomChartViewModel chart in tab.Charts)
			{
				int colSpan = 2;
				int rowSpan = 2;

				<TileLayoutItem RowSpan="@rowSpan" ColSpan="@colSpan">
					<HeaderTemplate>
						<div style="text-align: right">
							<TelerikButton OnClick="@(() => onDeleteChart(chart.Id, tab.Id))">X</TelerikButton>
						</div>
					</HeaderTemplate>	
					<Content>
						<ChartComponent ViewModel="@chart" @ref="@charts[chart.Id]" />
					</Content>
				</TileLayoutItem>
			}
		</TileLayoutItems>
	</TelerikTileLayout>
</TabStripTab>

And then a chart component that renders the individual charts with a tooltip

<TelerikChart @ref="@ChartRef" Height="100%" Width="100%" OnSeriesClick="@OnSeriesClickHandler">
	<ChartTooltip Visible="true">
		<Template>
			<TelerikIcon Icon="information" />
                    @(context.Percentage.ToString("P", nfi))<br />
					@((context.DataItem as MyDataModel).toolTip)
		</Template>
	</ChartTooltip>
	<ChartSeriesItems>
		<ChartSeries Type="ChartSeriesType.Donut" Data="@Data" Field="value" CategoryField="category" ColorField="color">
			<ChartSeriesLabels Position="ChartSeriesLabelsPosition.OutsideEnd"
							   Visible="@ViewModel.ShowLabels"
							   Background="transparent"
							   Template="#= category #: #= value#">
			</ChartSeriesLabels>
		</ChartSeries>
	</ChartSeriesItems>

	<ChartTitle Text="@ViewModel.Name"></ChartTitle>

	<ChartLegend Position="ChartLegendPosition.Bottom" Visible="@ViewModel.ShowLegend"></ChartLegend>
</TelerikChart>

Hello,

I'm using a numeric textbox and when I test my page for accessibility, Allyable reports the following:

Category: Ensure button or link have discernible text that is not repeated as image description

Selector: .k-form-field-wrap > .k-numerictextbox.k-widget > .k-numeric-wrap > .k-select > [role="button"].k-link-decrease

Severity: Critical

Here is my source code:

<TelerikNumericTextBox @bind-Value="@cardCleaner.Quantity" Id="cleanerQty" Width="100px" />

Is this really an accessibility issue?

Thanks,

Bernard