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

• When passing filter expressions from ToDataSourceRequest() directly into a LINQ-to-EF query, the resulting SQL query fails if the DateTime string has 0000000 (7 digits of precision).
• SQL Server’s datetime and datetime2 types don’t support nanosecond-level precision.
• EF Core attempts to translate it, but fails with SQL conversion errors

Please consider extending the GridColumn component to include fine-grained header presentation properties, such as:

• HeaderAlignment (e.g., Left, Center, Right)
• WrapHeaderText (bool)
• HeaderTooltip or HeaderAdornmentTemplate
  

These enhancements would dramatically improve clarity and usability in complex data grids.

Why This Is Important

In enterprise-grade applications — like ERP dashboards, financial reporting, or cutover schedules — grids are dense and loaded with meaning. Users rely heavily on headers to interpret the data beneath, especially when:

• Column headers are long or require abbreviations.
• Users need contextual guidance without clutter.
• Alignment improves visual scanning and aesthetics.

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 new grid-level properties to control visual styling and editing behavior more intuitively:

• HeaderThemeColor
• ShowGridLines
• EditModeDisplay (e.g., None, ValueOnly, All, Auto)
  

These options would provide teams with greater flexibility to align grids with branding, accessibility, and user interaction standards.

Why This Is Valuable

Grids are the centerpiece of most enterprise applications — and users rely on visual consistency and responsive interaction. Today’s grids need to:

• Match branding and accessibility guidelines (dark/light, color accessibility).
• Visually separate data (e.g., grid lines on for financial reports, off for dashboards).
• Clearly communicate edit state (inline, batch, or value-only editing).
  

These settings would empower developers to deliver purpose-built grids without deep CSS overrides or workarounds.

Please consider adding built-in support for a TextTruncationWithAction or TruncateWithButton mode on GridColumn components. This feature would display long text as truncated with ellipsis (...) and a button or icon to reveal the full content, such as in a modal or popover.

Why This Is Needed

In enterprise applications like ERP, cutover planning, or audit logs, we often display descriptions, notes, or comments that can span multiple lines. However:

• Wrapping ruins compact grid layouts.
• Truncating with ellipsis alone hides valuable content.
• Users need quick, inline access to full text without leaving the grid.

Would like a parameter in the grid definition that would display a Clear/Refresh button to return the grid to all originally selected records.  This feature would work similar to the Excel clear filter function.  

===

TELERIK EDIT: To reset the Grid filters, you can clear the FilterDescriptors collection and the SearchFilter property in the Grid state. Here is an example:

https://blazorrepl.telerik.com/cfEoatOr000uBdgW48

    private TelerikGrid<Product>? GridRef { get; set; }

    private async Task ClearGridFilters()
    {
        var gridState = GridRef!.GetState();

        gridState.FilterDescriptors = new List<IFilterDescriptor>();
        gridState.SearchFilter = default;

        await GridRef.SetStateAsync(gridState);
    }

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:

• Rule-level messages (e.g., “Only one Primary Owner allowed per group”).
• Cross-row or cross-field issues (e.g., overlapping dates, missing dependencies).
• Batch edit feedback (e.g., conflict indicators before submit).

Currently, there’s no clean way to show column-specific validation or guidance in a visual, inline way that:

• Doesn’t clutter the cell.
• Surfaces at the column level (just like a header).
• Feels native to the grid.

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:

• Filter to common scenarios (e.g., “My Tasks”, “Due This Week”, “Unassigned Only”).
• Avoid re-entering the same filters repeatedly.
• See role- or context-based presets applied consistently

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:

• Users often want to set multiple filters at once without interacting with tiny filter icons.
• They need to see all available filters in one place — especially in cutover task lists, audit views, or reporting grids.
• This UI pattern is familiar from tools like SharePoint, Power BI, and Microsoft Lists.

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:

• Similar grids across multiple tabs or modules
• Role-specific data views (e.g., “My Open Tasks”, “Org View Only”)
• Filtered subsets or critical cutover lists

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.

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.

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

I have a Telerik Pager within a Telerik Grid. If I select a larger page size within the pager, then select a smaller size and do not scroll, the next time I open the pager, the dropdown portion opens in the wrong place. When I view the inspect tool, it appears that the CSS top value is not being updated when changing page sizes from bigger to smaller. Is this a Telerik limitation with the pager?
In the images, we select items per page from 10 to 25, and then we go immediately from 25 to 10 items per page. Without scrolling, we click into the drop down list again and we are able to replicate this issue.

Before: Items per page:     10 -> 25

After:    


Thank you in advance.

Currently, when a user exports the Grid to Excel/CSV/PDF,  the export file is generated as a base64 string.

Please provide the file as a byte[] instead of a base64 string for better performance.

I need to know which cell the user right clicked on so I can adjust my context menu. I need the cell value, the row model and the field of the column.

---

ADMIN EDIT

The following KB article shows a solution you can use immediately: https://docs.telerik.com/blazor-ui/knowledge-base/grid-which-cell-context-menu.

---

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:

• What problems are you trying to solve?
• What benefits you want to achieve?
• Why the current Grid capabilities and behavior don't work for you?

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: 

• Set optimal fixed widths for all columns, or at least the ones with predictable content.
• Autofit the columns with non-predictable content, or simply set a bit larger widths to make sure the content doesn't clip or wrap.

Here is are a few links on the matter:

• How to wrap Grid headers
• Grid Width parameter
• Grid column auto-fitting
• Grid column width behavior

If after adding a new item to a grid with inline edit the save button is double-clicked (e.g. by accident) two new items are added instead of one. Right now, the only way to prevent this seems to be to check if an item is already contained in GridData at the top of the OnCreate-Handler and cancel if necessary.  If a unique ID is not available yet (because it is created by the database when saving at the end of the handler) this means every Property has to be compared to check for equality.  This is very annoying.

Please add a parameter "DisableWhileBeingHandled" to TelerikButtons and make this the default for the CommandButtons in a Grid. The Buttons should only accept clicks if the previous handling is finished.

Kind regards,

René

I AutoFit all columns in the Grid but would like to be able to reset their width to the initial value at a later point. 

===

TELERIK EDIT: Here are two workarounds for two possible scenarios:

• Reset all column widths to another value or "auto" value.
• Adjust the last column's width, so that there is no empty space after it.

Reset all column widths to another value or "auto" value

<TelerikButton ThemeColor="@ThemeConstants.Button.ThemeColor.Primary"
               OnClick="@AutoFitColumns">AutoFit Columns</TelerikButton>
<TelerikButton ThemeColor="@ThemeConstants.Button.ThemeColor.Success"
               OnClick="@ResetColumns">Reset Column Widths</TelerikButton>

<TelerikGrid @ref="@GridRef"
             Data="@GridData"
             Reorderable="true"
             Resizable="true">
    <GridColumns>
        <GridColumn Field="@nameof(Product.Id)" />
        <GridColumn Field="@nameof(Product.Name)" />
        <GridColumn Field="@nameof(Product.Category)" />
        <GridColumn Field="@nameof(Product.Stock)" />
        <GridColumn Field="@nameof(Product.Discontinued)" />
    </GridColumns>
</TelerikGrid>

@code {
    private TelerikGrid<Product>? GridRef { get; set; }

    private List<Product> GridData { get; set; } = new();

    private async Task AutoFitColumns()
    {
        if (GridRef == null)
        {
            return;
        }

        await GridRef.AutoFitAllColumnsAsync();
    }

    private async Task ResetColumns()
    {
        if (GridRef == null)
        {
            return;
        }

        var gridState = GridRef.GetState();

        foreach (var columnState in gridState.ColumnStates)
        {
            columnState.Width = "auto;";
        }

        gridState.TableWidth = $"99.9{DateTime.Now.Millisecond}%"; // Set something close to 100% instead of removing the value

        await GridRef.SetStateAsync(gridState);
    }

    protected override void OnInitialized()
    {
        for (int i = 1; i <= 5; i++)
        {
            GridData.Add(new Product()
            {
                Id = i,
                Name = $"Product {i}",
                Category = $"Category {i % 4 + 1}",
                Stock = Random.Shared.Next(0, 100),
                Discontinued = i % 3 == 0
            });
        }
    }

    public class Product
    {
        public int Id { get; set; }
        public string Name { get; set; } = string.Empty;
        public string Category { get; set; } = string.Empty;
        public int Stock { get; set; }
        public bool Discontinued { get; set; }
    }
}

Adjust the last column's width, so that there is no empty space after it

<TelerikGrid @ref="@GridRef"
             Data="@GridData"
             Reorderable="true"
             Resizable="true"
             Width="@GridWidth"
             ShowColumnMenu="true"
             OnStateChanged="@( (GridStateEventArgs<Product> args) => OnGridStateChanged(args) )">
    <GridColumns>
        <GridCheckboxColumn SelectAll="true" />
        <GridColumn Field="@nameof(Product.Id)" />
        <GridColumn Field="@nameof(Product.Name)" />
        <GridColumn Field="@nameof(Product.Category)" />
        <GridColumn Field="@nameof(Product.Stock)" />
        <GridColumn Field="@nameof(Product.Discontinued)" />
    </GridColumns>
</TelerikGrid>

@code {
    private TelerikGrid<Product>? GridRef { get; set; }

    private List<Product> GridData { get; set; } = new();
    private string GridWidth => $"{GridIntWidth}px";

    private int GridIntWidth = 1000; // A pixel Grid width is required for this scenario
    private int GridMaxTableIntWidth => GridIntWidth - 17; // Assuming no horizontal scrolling

    private async Task OnGridStateChanged(GridStateEventArgs<Product> args)
    {
        if (args.PropertyName == "ColumnStates" && Double.Parse(args.GridState.TableWidth.Replace("px", "")) < GridMaxTableIntWidth)
        {
            args.GridState.TableWidth = $"99.9{DateTime.Now.Millisecond}%"; // Set something close to 100% instead of removing the value

            int lastVisibleColumnIndex = GetLastVisibleIndex(args.GridState.ColumnStates);
            args.GridState.ColumnStates.First(x => x.Index == lastVisibleColumnIndex).Width = "auto";

            await GridRef!.SetStateAsync(args.GridState);
        }
    }

    private int GetLastVisibleIndex(ICollection<GridColumnState> columnStates)
    {
        int index = 0;

        var visibleColumnStates = columnStates.Where(x => !x.Visible.HasValue || x.Visible.Value);

        foreach (var columnState in visibleColumnStates)
        {
            index = Math.Max(index, columnState.Index);
        }

        return index;
    }

    protected override void OnInitialized()
    {
        for (int i = 1; i <= 5; i++)
        {
            GridData.Add(new Product()
            {
                Id = i,
                Name = $"Product {i}",
                Category = $"Category {i % 4 + 1}",
                Stock = Random.Shared.Next(0, 100),
                Discontinued = i % 3 == 0
            });
        }
    }

    public class Product
    {
        public int Id { get; set; }
        public string Name { get; set; } = string.Empty;
        public string Category { get; set; } = string.Empty;
        public int Stock { get; set; }
        public bool Discontinued { get; set; }
    }
}