Using the grid with OnRead event to fill data. I need to set the sortings at runtime, so I use also the OnStateInit event.
It all works fine because OnStateInit fires before OnRead and I set the sorting inside OnStateInit.
If I put an empty GridAggregates then OnStateInit fires after OnRead thus inside OnRead I don't have the sortings set.
===
ADMIN EDIT
===
As a workaround for the time being, do not include empty GridAggregates tag, only add them when you actually want to include some aggregate functions.
<ColumnMenu>
<ColumnMenuFiltering/>
<ColumnMenuSorting/>
....
</ColumnMenu>I previously raised an issue regarding the grid popup editor not linking the labels with the generated text inputs which was creating an issue with screenreaders. Since upgrading to version 7.1.0, I've seen that this issue has been fixed but in a way that breaks editor templates. Previously, the "for" attribute of the generated label was being set to the label text, but now everything is being set to a generated GUID.
This is fine for the generated fields since they can link the labels to the controls automatically (by setting the ID of the control to the GUID), but for templates, this means that we cannot link the generated label to the control since we cannot get access to the GUID in the template (as far as I know). Previously, when the "for" attribute on templates was the same as the label text, I could set the ID of the custom template control to the label text and the controls will be linked correctly.
===
ADMIN EDIT
===
For the time being, possible workarounds are:I have a master-detail draggable Grid scenario in which both Grids have RowDraggable="true". When the user starts dragging a row from the DetailTemplate Grid, a JavaScript error occurs:
TypeError: Argument 1 ('node') to Node.replaceChild must be an instance of Node
After filtering a nullable DateTime column, the SelectAll checkbox in the GridCheckboxColumn becomes selected, and its functionality stops working correctly.
Please add support for automatic Grid table layout, which will allow column widths to be set by the browser, based on the cell content.
===
TELERIK EDIT:
This is a huge task with many implications. We require large-enough customer demand before we start exploring or implementing it.
Everyone who is interested, please drop a few lines here and share:
Here are some thoughts on the matter:
HTML tables have two layout modes: auto and fixed. In auto layout, the table column widths depend on the content. In fixed layout, all column widths are equal or obey the set styles, no matter the content.
The Blazor Grid renders separate tables for its header cells and data cells. This allows the data area to scroll, while the header area remains visible at all times. The only reliable way to ensure column alignment between the two tables is to apply a fixed table-layout style. This results in the behavior, which we have described in the documentation.
The only way to have auto table layout in the Blazor Grid is to render the component as a single <table>, which is currently not available.
Possible workarounds include:
Here is are a few links on the matter:
In many cases the header text of columns gets truncated to an ellipses if the columns aren't wide enough. It would be nice if there was a global way to display a tooltip for each column header that is made up of the header text. I know that I can do this using the column header template, but that will require that I create a template for every column in all of my grids. I'm looking for a way to have it work globally. This could be with a general header template that has context about the header Title, or just a Boolean flag to display column header tooltips.
Thanks,
Mike
When the Grid PageSize exceeds the current data count and the InputType is Input, the Pager content cannot gain focus with the keyboard.
Here is a test page. A possible workaround is to switch the InputType at runtime. Then the user will be able to focus inside the Pager.
In some scenarios you may need a bit of extra code to get the current Grid item count.
<TelerikGrid Data="@GridData"
Pageable="true"
@bind-PageSize="@GridPageSize"
Navigable="true">
<GridSettings>
<GridPagerSettings InputType="@GridPagerInputType"
PageSizes="@( new List<int?> { 2, 5 } )" />
</GridSettings>
<GridColumns>
<GridColumn Field="@nameof(SampleModel.Name)" />
</GridColumns>
</TelerikGrid>
@code {
private List<SampleModel> GridData { get; set; } = new();
private int GridPageSize { get; set; } = 5;
//private PagerInputType GridPagerInputType { get; set; } = PagerInputType.Input;
private PagerInputType GridPagerInputType => GridPageSize >= GridData.Count ? PagerInputType.Buttons : PagerInputType.Input;
protected override void OnInitialized()
{
for (int i = 1; i <= 3; i++)
{
GridData.Add(new SampleModel()
{
Id = i,
Name = $"Name {i}"
});
}
}
public class SampleModel
{
public int Id { get; set; }
public string Name { get; set; } = string.Empty;
}
}
The Grid performance worsens progressively with each subsequent edit operation. Please optimize that.
Test page: https://blazorrepl.telerik.com/mJuHFNbb17FpJu9b54
Click on a Price or Quantity cell to start edit mode and tab repetitively to observe the degradation.
Please consider adding a TooltipTemplate parameter to the GridColumn component to allow developers to define custom tooltips for each cell using the same template logic available in CellTemplate.
Why This Matters
In enterprise applications — especially in ERP dashboards, cutover schedules, and KPI reports — data often needs contextual clarification. While tooltips are supported globally or via title attributes, there’s currently no clean, built-in way to customize tooltips per column using templating logic.
Please consider adding support for an optional header row indicator that can display a conditional icon + themed tooltip, used to show non-field-level validation or status messages — especially during inline or in-cell editing, and ideally in batch edit scenarios.
Why This Is Needed
In enterprise applications — especially those with batch entry workflows, cutover planning, or financial approvals — validation needs often extend beyond just field-level errors. Common use cases include:
Currently, there’s no clean way to show column-specific validation or guidance in a visual, inline way that:
Please consider altering or providing configuration for how DateTime values are formatted in filter expressions generated by ToDataSourceRequest(). Currently, the format includes full precision (e.g., 2025-04-04T00:00:00.0000000), which causes issues when passed to Entity Framework Core with SQL Server, as SQL Server expects precision up to milliseconds (.fff), not ticks (.fffffff).
Why This Is a Problem
Please add a ToolbarTitle property to grid components, with an optional ToolbarTitleTooltip or ToolbarTitleAdornmentTemplate. This would allow developers to display a title with optional help text directly in the toolbar — giving users immediate context on the data being displayed.
Why This Is Valuable
In enterprise apps — particularly in areas like dashboards, scheduling, and ERP grids — users are often viewing:
Providing a toolbar-level title with a subtle help icon improves discoverability and reduces confusion — especially when filters or dynamic data shaping is in play.
Please add a built-in way to define a list of predefined filters (filter presets) within the ToolbarTemplate of a grid. This would allow users to quickly select a filter configuration, which is then automatically applied to the grid’s DataSourceRequest.
Why This Is InvaluablE
In enterprise apps with dense, multi-column grids, users often need to:
Currently, implementing this requires custom filter logic, state management, and manual data reloading — even though the concept is straightforward from a user’s perspective.
Please add support for a right-side filter panel (sidebar) that dynamically renders filter controls based on the grid’s visible columns and their editor templates. The panel would allow users to apply multiple filters at once, similar to SharePoint’s column filter experience — in a tall, narrow layout with an “Apply Filters” button.
Why This Matters
While column-level filters are useful, in real-world business apps:
After filtering a nullable int column, the SelectAll checkbox in the GridCheckboxColumn stops working.
Reproduction example: https://blazorrepl.telerik.com/mTuyHaYM44sLH2yf05
I would like to add some custom actions into the popup window. I know I can implement a custom edit popup with an entirely custom content and actions. However, this requires a lot of custom work to just add one additional action in the popup. Please provide an easier option to add custom actions in the edit window.