In Development
Last Updated: 04 Sep 2025 09:23 by ADMIN
Scheduled for 2025 Q4 (Nov)
Created by: Mattia
Comments: 0
Category: Grid
Type: Bug Report
1

Description

Regression introduced in version 10.0.0.

Steps To Reproduce

  1. Run this example: https://blazorrepl.telerik.com/GJkCGCvE51aGglud38
  2. Filter a Grid column and observe the log below the component.

Actual Behavior

The OnStateChanged event fires 4 times

Expected Behavior

The OnStateChanged event fires 2 times (see https://www.telerik.com/blazor-ui/documentation/components/grid/state#onstatechanged).

Browser

All

Last working version of Telerik UI for Blazor (if regression)

9.1.0

Completed
Last Updated: 03 Sep 2025 08:34 by ADMIN
Release 2025 Q4 (Nov)

We are experiencing an issue where the ExportToPdfAsync() method on TelerikGrid is returning Excel data (XLSX format) instead of PDF data. This is causing MIME type errors when trying to process the exported data as a PDF.

 

===ADMIN EDIT===

Workaround

In the meantime, a possible workaround would be to use the document processing library (make sure the correct packages are installed for it) and import the xlsx file to a workbook, and then export the workbook to PDF. Here is an improvised example that demonstrates this by saving the file in your wwwroot folder as a pdf.

@inject IWebHostEnvironment HostingEnvironment

<TelerikGrid Data="@bookList" Height="75svh" Resizable="true" Sortable="true" Pageable="true" PageSize="15"
             FilterMode="@GridFilterMode.FilterMenu" SelectionMode="@GridSelectionMode.Multiple"
             SelectedItems="@SelectedBooks" @ref="@BookGrid"
             SelectedItemsChanged="@((IEnumerable<BookInfo> sel) => OnRowSelect(sel))">
    <GridToolBarTemplate>
        <TelerikButton OnClick="@GenerateReport">Generate PDF</TelerikButton>
    </GridToolBarTemplate>
    <GridExport>
        <GridPdfExport AllPages="true" PageOrientation="GridPdfExportPageOrientation.Landscape"
                       PaperSize="GridPdfExportPaperSize.A3" />
    </GridExport>
    <GridColumns>
        <GridCheckboxColumn CheckBoxOnlySelection="true"></GridCheckboxColumn>
        <GridColumn Field="ISBN">
            <HeaderTemplate><b>ISBN</b></HeaderTemplate>
        </GridColumn>
        <GridColumn Field="Author">
            <HeaderTemplate><b>Author</b></HeaderTemplate>
        </GridColumn>
        <GridColumn Field="Title">
            <HeaderTemplate><b>Title</b></HeaderTemplate>
        </GridColumn>
        <GridColumn Field="Genre">
            <HeaderTemplate><b>Genre</b></HeaderTemplate>
        </GridColumn>
        <GridColumn Field="PublishedYear">
            <HeaderTemplate><b>Year</b></HeaderTemplate>
        </GridColumn>
        <GridColumn Field="CopiesAvailable">
            <HeaderTemplate><b>Copies</b></HeaderTemplate>
        </GridColumn>
    </GridColumns>
</TelerikGrid>

@code {
    private async Task GenerateReport()
    {
        isLoading = true;
        var pdfStream = await BookGrid.ExportToPdfAsync();

        // The stream is actually XLSX, so convert it to PDF
        using var ms = new MemoryStream(pdfStream.ToArray());

        var xlsxProvider = new Telerik.Windows.Documents.Spreadsheet.FormatProviders.OpenXml.Xlsx.XlsxFormatProvider();
        var workbook = xlsxProvider.Import(ms);

        var rootPath = HostingEnvironment.WebRootPath;
        var saveLocation = Path.Combine(rootPath, "LibraryBooks.pdf");
        var pdfProvider = new Telerik.Windows.Documents.Spreadsheet.FormatProviders.Pdf.PdfFormatProvider();
        using (var fileStream = new FileStream(saveLocation, FileMode.Create))
        {
            pdfProvider.Export(workbook, fileStream);
        }
    }

    public class BookInfo
    {
        public string ISBN { get; set; }
        public string Author { get; set; }
        public string Title { get; set; }
        public string Genre { get; set; }
        public int PublishedYear { get; set; }
        public int CopiesAvailable { get; set; }
    }

    private List<BookInfo> bookList = new()
    {
        new BookInfo { ISBN = "978-0451524935", Author = "George Orwell", Title = "1984", Genre = "Dystopian", PublishedYear = 1949, CopiesAvailable = 4 },
        new BookInfo { ISBN = "978-0439139601", Author = "J.K. Rowling", Title = "Harry Potter and the Goblet of Fire", Genre = "Fantasy", PublishedYear = 2000, CopiesAvailable = 7 },
        new BookInfo { ISBN = "978-0140449266", Author = "Homer", Title = "The Odyssey", Genre = "Epic Poetry", PublishedYear = -800, CopiesAvailable = 2 }
    };

    private TelerikGrid<BookInfo> BookGrid;
    private List<BookInfo> SelectedBooks = new();
    private bool isLoading = false;

    private void OnRowSelect(IEnumerable<BookInfo> selected)
    {
        SelectedBooks = selected.ToList();
    }
}

 

Completed
Last Updated: 30 Sep 2025 07:19 by ADMIN
Release 2025 Q4 (Nov)
Created by: Plastic
Comments: 6
Category: Grid
Type: Bug Report
1
A Grid component with a ColumnMenu increases memory usage due to event handler leaks specifically associated with the ColumnMenu.
Completed
Last Updated: 01 Oct 2025 07:47 by ADMIN
Release 2025 Q4 (Nov)
Created by: Plastic
Comments: 0
Category: Grid
Type: Bug Report
1

A Grid component with GridToolBar increases memory usage due to event handler leaks, specifically associated with the GridToolBar and ColumnMenuToolBar.

 

Completed
Last Updated: 13 Oct 2025 11:47 by ADMIN
Release 2025 Q4 (Nov)

Hello,

I’ve run into a reproducible issue with the Blazor Grid in Adaptive mode. After the grid adapts to a smaller container and then the container is expanded again, the data rows scroll while the header remains fixed, so the header and data become detached.

I’m attaching three screenshots that show the sequence:

  1. 01.png — Grid in normal (non-adaptive) state.
  2. 02.png — After shrinking the container until the grid switches to Adaptive.
  3. 03.png — After expanding the container again; scrolling the grid shows the header no longer tracks with the data.

Steps to reproduce

  1. Open the REPL I’m providing: [REPL link here].
  2. Shrink the container (e.g., resize the pane/window) until the grid switches to Adaptive mode.
  3. Expand the container back to a larger width so the grid returns to its standard table view.
  4. Scroll the grid using the scrollbar/slider: the body content scrolls, but the header stays static and is no longer aligned with the data.

Expected behavior

Header and data remain synchronized—when the grid is scrolled horizontally/vertically, both header and rows should scroll together.

Actual behavior

After returning from Adaptive to the standard layout, the header does not move with the rows when scrolling; it appears “detached”.

Notes

  • I did not add any custom CSS related to header/body layout in the demo.
  • I haven’t identified a reliable workaround yet.


Please let me know if this is a known issue, if there’s a fix/workaround, or if you need any additional details.

REPL: https://blazorrepl.telerik.com/cfkXlLFd30pGcc6i09?_gl=1*4qgvh1*_gcl_au*OTEyODU4MzMuMTc1NzU3NDk1Ng..*_ga*MTc1OTQ2OTkzNy4xNzU3NTc0ODY4*_ga_9JSNBCSF54*czE3NTk5OTkxMjgkbzEwJGcxJHQxNzYwMDAxNTkwJGo1MyRsMCRoMA..

Unplanned
Last Updated: 30 Oct 2025 15:22 by Eric
  • If you select a row and then unselect that row (SelectedItems is empty), and hit the incorrectly enabled delete button, it removes a row that has not been selected. When there is no selected row, the delete tool should be disabled.
  • If you use multiple selection, the delete tool will delete the last row, which is unexpected. It should delete all selected rows.

Workaround:

<TelerikGrid Data="@GridData"
             SelectionMode="@GridSelectionMode.Multiple"
             SelectedItems="@SelectedItems"
             SelectedItemsChanged="@( (IEnumerable<Employee> newSelected) => OnSelectedItemsChanged(newSelected) )"
             Height="300px">
    <GridToolBarTemplate>
        <TelerikButton Enabled="@(SelectedItems.Any())" OnClick="@DeleteSelectedEmployees">Delete</TelerikButton>
    </GridToolBarTemplate>
    <GridColumns>
        <GridCheckboxColumn SelectAll="true" />
        <GridColumn Field="Name" Title="Name" />
        <GridColumn Field="Team" Title="Team" />
    </GridColumns>
</TelerikGrid>

@code {
    private List<Employee> GridData { get; set; } = Enumerable.Range(1, 10).Select(i => new Employee
    {
        EmployeeId = i,
        Name = $"Employee {i}",
        Team = $"Team {i % 3}"
    }).ToList();

    private List<Employee> SelectedItems { get; set; } = new();

    private void OnSelectedItemsChanged(IEnumerable<Employee> items)
    {
        SelectedItems = items.ToList();
    }

    private void DeleteSelectedEmployees()
    {
        if (SelectedItems.Any())
        {
            GridData = GridData.Except(SelectedItems).ToList();
            SelectedItems.Clear();
        }
    }

    public class Employee
    {
        public int EmployeeId { get; set; }
        public string Name { get; set; }
        public string Team { get; set; }
        public override bool Equals(object obj) => obj is Employee e && e.EmployeeId == EmployeeId;
        public override int GetHashCode() => EmployeeId.GetHashCode();
    }
}

Unplanned
Last Updated: 31 Oct 2025 12:16 by Scott
The column menu correctly repositions itself (to the left or top) when first opened, depending on available screen space. However, when expanding a submenu such as Columns, the menu does not adjust its position to ensure the expanded content remains visible within the viewport.
Unplanned
Last Updated: 03 Nov 2025 08:45 by Jorge
Created by: Jorge
Comments: 0
Category: Grid
Type: Feature Request
1

Please add support for programmatic exporting of Grids (SaveAsExcelFileAsync() and ExportToExcelAsync() ) with a GridExcelExportOptions argument and multi-column headers.

===

A potential workaround is to programmatically click the built-in export command button, which can even be hidden:

@using Telerik.Blazor.Components.Grid

@inject IJSRuntime JS

<PageTitle>Home</PageTitle>

<TelerikGrid Data="@GridData">
    <GridToolBarTemplate>
        <TelerikButton OnClick="@ExportGridWithOtherColumns">Export Programmatically</TelerikButton>
        <GridCommandButton Class="hidden-export-button" Command="ExcelExport">Export Natively</GridCommandButton>
    </GridToolBarTemplate>
    <GridSettings>
        <GridExcelExport OnBeforeExport="@OnGridBeforeExport" />
    </GridSettings>
    <GridColumns>
        <GridColumn Field="@nameof(Product.Id)" Width="100px" />
        <GridColumn Field="@nameof(Product.Name)" Width="120px" />
        <GridColumn Title="Product Details">
            <Columns>
                <GridColumn Field="@nameof(Product.Group)" Width="180px" />
                <GridColumn Field="@nameof(Product.Price)" DisplayFormat="{0:c2}" Width="120px" />
                <GridColumn Field="@nameof(Product.Quantity)" DisplayFormat="{0:n0}" Width="120px" />
                <GridColumn Field="@nameof(Product.Released)" DisplayFormat="{0:d}" Width="180px" />
                <GridColumn Field="@nameof(Product.Discontinued)" Width="100px" />
            </Columns>
        </GridColumn>
    </GridColumns>
</TelerikGrid>

<style>
    .hidden-export-button {
        display: none;
    }
</style>

<script suppress-error="BL9992">
    function clickExportCommandButton() {
        let hiddenExportButton = document.querySelector(".hidden-export-button");
        if (hiddenExportButton) {
            hiddenExportButton.click();
        }
    }
</script>

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

    private void OnGridBeforeExport(GridBeforeExcelExportEventArgs args)
    {
        List<string> exportableColumnFields = new List<string> { nameof(Product.Name), nameof(Product.Price), nameof(Product.Quantity) };
        List<GridExcelExportColumn> ColumnsToExport = new();

        foreach (GridExcelExportColumn column in args.Columns)
        {
            if (exportableColumnFields.Contains(column.Field))
            {
                ColumnsToExport.Add(column);
            }
        }

        args.Columns = ColumnsToExport;
    }

    private async Task ExportGridWithOtherColumns()
    {
        await JS.InvokeVoidAsync("clickExportCommandButton");
    }

    protected override void OnInitialized()
    {
        var rnd = Random.Shared;

        for (int i = 1; i <= 7; i++)
        {
            GridData.Add(new Product()
            {
                Id = i,
                Name = $"Name {i} {(char)rnd.Next(65, 91)}{(char)rnd.Next(65, 91)}",
                Group = $"Group {i % 3 + 1}",
                Price = rnd.Next(1, 100) * 1.23m,
                Quantity = rnd.Next(0, 10000),
                Released = DateTime.Today.AddDays(-rnd.Next(60, 1000)),
                Discontinued = i % 4 == 0
            });
        }
    }

    public class Product
    {
        public int Id { get; set; }
        public string Name { get; set; } = string.Empty;
        public string Group { get; set; } = string.Empty;
        public decimal Price { get; set; }
        public int Quantity { get; set; }
        public DateTime Released { get; set; }
        public bool Discontinued { get; set; }
    }
}

Declined
Last Updated: 28 Apr 2019 05:28 by ADMIN
Created by: Mark
Comments: 5
Category: Grid
Type: Bug Report
0

The TelerikGrid never loads any data. the app just hangs. 

I copied the Telerik sample from the online demo. 

 The HTML table loads perfectly.

 Using VS 2019  16.1.0 Preview 2.0.

Acquired Telerik nuget package directly from Telerik feed.

 

 

 

    <TelerikGrid Data=@ViewModel.GetCorePharmacies() Height="300">
        <TelerikGridColumns>
            <TelerikGridColumn Field="ID" Title="NCPDP#" />
            <TelerikGridColumn Field="NPINumber" Title="NPI#" />
            <TelerikGridColumn Field="DBAName" Title="Pharmacy" />
            <TelerikGridColumn Field="StoreNumber" Title="Store#" />
        </TelerikGridColumns>
    </TelerikGrid>

    @*<table class="table">
        <thead>
            <tr>
                <th>NCPDP</th>
                <th>NPI</th>
                <th>DBA Name</th>
                <th>Store#</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var pharmacy in ViewModel.GetCorePharmacies())
            {
                <tr>
                    <td>@pharmacy.ID.ToString()</td>
                    <td>@pharmacy.NPINumber.ToString()</td>
                    <td>@pharmacy.DBAName</td>
                    <td>@pharmacy.StoreNumber</td>
                </tr>
            }
        </tbody>
    </table>*@

 

Any thoughts. 

Completed
Last Updated: 21 May 2019 10:53 by ADMIN
Release 1.1.0
I have a Grid control with columns set as editable= false.  When I click a row into edit mode all the columns still appear as editable. Is there something else that needs to be set?
Completed
Last Updated: 03 Jul 2019 11:48 by ADMIN
Release 1.3.0

Super low priority and super nit picky ... The command buttons on the Blazor Grid have extra space after the icon if you leave the name blank. Either remove the space or center the icon when no name is entered.

 

      

Completed
Last Updated: 08 Jul 2019 15:49 by ADMIN
Release 1.3.0

Dear Telerik,

i have a TelerikGrid with a TelerikGridColumn bound to a Decimal field.

The property  Editable="true" is set.

I can edit the number , but only 1 number at te time.
If I type one number, the edit-cell is closed immediately.

If I want to input the number 1000 , I habe to click the cell 4 times for each number . I cannot type 1000 in one action.

The problem does not occur with a String column.

Regards,

Gert


Duplicated
Last Updated: 02 Mar 2020 13:27 by ADMIN

Hello,

I'm trying the grid component and I'm able to add a row to the grid using the embbed editor. But I wanted to add an item externally to the list:


<button @onclick="@MyClick">Add item</button>

 

void MyClick()
{
    MyData.Add(new SampleData() { ID = 46, Name = "from click" });
    StateHasChanged();
}

The new line does not appear on the grid but if I add a second item through the embbed editor then I get the 2 items!

I also try to replace the List<MyData> by an ObservableCollection<MyData> unsuccessfully.

 

Thanks & regards,

 

Duplicated
Last Updated: 02 Mar 2020 13:24 by ADMIN
Created by: Shaun
Comments: 1
Category: Grid
Type: Bug Report
0

Here is how this page looks on mac, multiple browsers: https://demos.telerik.com/blazor-ui/grid/grouping

 

 

Notice that the columns are misaligned.  I believe this is because the scrollbar isn't rendered on a mac if it is "disabled" (there is nothing to scroll). 

Probably the best solution would be for it to render like this on all browsers, but have the columns line up (get rid of the spacer in the end of the header row) as the 'empty' scrollbar is not attractive :)

Declined
Last Updated: 01 Oct 2019 10:05 by ADMIN

Telerik Blazor version 1.5.0 Trial

Steps to reproduce:

  1. Open a page with a grid in incell edit mode, e.g. https://demos.telerik.com/blazor-ui/grid/editing-incell
  2. Put the cursor in the Name field of the first row and edit the just the Name field, do not click out of the cell or cause it to lose focus, do not edit any other cells first
  3. Press the Add button
  4. The grid will update the dataset and the edit you made is shown in the grid
  5. Press the Add button
  6. Enter the all of the data for the row, but do not press the row's 'Update' button
  7. Press the Add button again
  8. The new data you added is lost

This behaviour is inconsistent as the user is required to press the Update button to save a new row, but not to save changes for an existing row.  Can the grid be made to retain the new row when the Add button is pressed (or can we have that option)?

I think the base issue here is that the new row isn't added automatically when the cell/row loses focus.  The same issue therefore occurs if you press one of the page buttons at the bottom of the grid at step 3 instead.

 

 

Declined
Last Updated: 01 Oct 2019 10:04 by ADMIN
Created by: Neil Jackson
Comments: 4
Category: Grid
Type: Bug Report
0

Hi,

I cant see what it is that's causing this error. evertime i run my app, i get the follwoing error below:

An unhandled exception occurred while processing the request.

InvalidOperationException: Object of type 'Telerik.Blazor.Components.Grid.TelerikGrid`1[[BlazorApp1.Core.DTO.AuditEventTypeDTO, BlazorApp1.Core, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]]' does not have a property matching the name 'ChildContent'.

Microsoft.AspNetCore.Components.Reflection.ComponentProperties.ThrowForUnknownIncomingParameterName(Type targetType, string parameterName

 

My Code:

@page "/Table"

@inject IPurchaseOrderRepository purchaseOrderRepository
@using Telerik.Blazor.Components.Grid
    <h3>Table</h3>

<TelerikGrid Data=@auditEventTypeDTOs>
    <TelerikGridColumn Field="AuditEventName">

    </TelerikGridColumn>
</TelerikGrid>


@code{



    public IEnumerable<AuditEventTypeDTO> auditEventTypeDTOs { get; set; }

    protected override async Task OnInitializedAsync()
    {
        auditEventTypeDTOs = await purchaseOrderRepository.GetAllAuditEventTypes();
    }

}

 

 

The IEnumerable object 'auditEventTypeDTOs' is getting the data from the repository and i've made sure that i don't have any component with the same name within Telerik.blazor namespace.

 

Do let me know if you need me me to supply more information.

 

many thanks in advance

 

George.

Completed
Last Updated: 12 Sep 2019 04:55 by ADMIN
I have NEVER seen a real world UI with a DropDownList in a Grid where you didn't want to save the ValueField of the DropDownList (ex. Product ID), but also wanted to display the TextField (ex. Product Name) as well as sort and filter by the TextField.  This functionality should be part of the grid and the default behavior for DropDownLists.
Completed
Last Updated: 30 Oct 2019 14:56 by ADMIN
Release 2.3.0
Put the snippet in the index page

Expected: the grid has data

Actual: the grid has no data, it shows up after a data source operation like filter/group

Sample:

@using ClientApp.Shared
@inject HttpClient Http

<TelerikGrid Data=@forecasts Height="550px"
                Pageable="true" Sortable="true"
                PageSize="20" Groupable="true">
    <GridColumns>
        <GridColumn Field="Date">
            <Template>
                @((context as WeatherForecast).Date.ToString("dddd, dd MMM yyyy"))
            </Template>
        </GridColumn>
        <GridColumn Field="TemperatureC" Title="Temp. C" />
        <GridColumn Field="TemperatureF" Title="Temp. F" />
        <GridColumn Field="Summary" />
    </GridColumns>
</TelerikGrid>

@code {

    //List<WeatherForecast> forecasts { get; set; } = new List<WeatherForecast>(); // Works fine!


    List<WeatherForecast> forecasts { get; set; } //Need to sort a field to show the rows

    protected override async Task OnInitializedAsync()
    {
        //forecasts = new List<WeatherForecast>(); //this helps

        forecasts = await Http.GetJsonAsync<List<WeatherForecast>>("WeatherForecast");

        //these do not help
        //await Task.Delay(200);
        //StateHasChanged();
    }
}

Completed
Last Updated: 09 Dec 2019 15:10 by ADMIN
Release 2.5.1

I had a working server-side Blazor project that was working, but a problem appears to have begun without me changing any code. I upgraded to the latest version (2.4.0) and am having the same problem.

The SelectedItemsChanged event is not working when a checkbox is checked. If I click outside the checkbox in the same column, the event fires however.

I see similar behavior on your own demo page, so this seems like a bug: https://demos.telerik.com/blazor-ui/grid/selection Check some products on that grid and the selected items do not change below. I've tested this in Vivaldi and Edge.

Thanks,
Sean

Duplicated
Last Updated: 02 Mar 2020 13:15 by ADMIN
Created by: Krister Svärd
Comments: 1
Category: Grid
Type: Bug Report
0

Hello!

The multiple selection functionality in the grid no longer works as expected.

The select check boxes doesn't seem to do anything and the only way to select something is when clicking on the actual row.

The problem is also present on your demo page.

ADMIN EDIT: Duplicate of https://feedback.telerik.com/blazor/1443720-selection-does-not-work-when-clicking-on-the-checkbox-works-when-clicking-the-row

 

https://demos.telerik.com/blazor-ui/grid/selection?_ga=2.224802330.1814754023.1575533932-806712588.1566825973&_gac=1.19805898.1574257348.Cj0KCQiA5dPuBRCrARIsAJL7oejqGKCIKhHZYlO3abQIbwwTOsvIVlWTqJ7CCdov38W-l8cArPTRpjEaAt0jEALw_wcB

Best regards.