Completed
Last Updated: 23 Feb 2024 10:42 by ADMIN
Release 4.3.0 (06/07/2023) (R2 2023)

Triggering Edit in a Grid bound to a DataTable or ExpandoObject and with edit mode set to Popup throws an unhandled exception. This started to occur in 4.1.0 - the same code runs fine on 4.0.1

To reproduce:

  1. run https://blazorrepl.telerik.com/cduHQkPS34V0enTc50 (note this is the DataTable demo, but with changed edit mode)
  2. trigger edit mode
  3. observe the unhandled exception
In Development
Last Updated: 23 Feb 2024 10:29 by ADMIN

---

ADMIN EDIT

Attached to this post are a reproducible and a workaround - setting the state in OnAfterRenderAsync with a small delay, so the initial grid render happens, then it can re-render and take the filters into account.

---

Unplanned
Last Updated: 23 Feb 2024 07:50 by Steffen
Created by: Greg
Comments: 13
Category: Grid
Type: Feature Request
30
My users need to select cells rather than entire rows, as they come from an MS Access background.
Planned
Last Updated: 22 Feb 2024 19:49 by ADMIN
Scheduled for 2024 Q2 (May)

Hello,

Do you have any sample for custom group Header template.

 

e..g. To  calculate the value of the column based on the other fields.

---

ADMIN EDIT

---

Once aggregates for all fields are exposed, we will need to provide an option to align them with the corresponding columns. This can be achieved through a GroupHeaderColumnTemplate which is targeted in a separate request.

Completed
Last Updated: 22 Feb 2024 13:31 by ADMIN
Release 2024 Q2 (May)
Created by: David
Comments: 0
Category: Grid
Type: Bug Report
6

When the Grid is databound via OnRead event, the initially displayed aggregates are wrong and take into account the first page only.

A possible workaround is to bind the Grid in OnAfterRenderAsync -

@using Telerik.DataSource
@using Telerik.DataSource.Extensions

<TelerikGrid @ref="@GridRef"
             OnRead="@OnGridRead"
             TItem="@Product"
             Pageable="true">
    <GridAggregates>
        <GridAggregate Field="@nameof(Product.Name)" Aggregate="@GridAggregateType.Count" FieldType="@(typeof(System.String))" />
    </GridAggregates>
    <GridColumns>
        <GridColumn Field="@nameof(Product.Name)" Title="Product Name">
            <FooterTemplate>
                @context.Count
            </FooterTemplate>
        </GridColumn>
        <GridColumn Field="@nameof(Product.Price)" />
        <GridColumn Field="@nameof(Product.ReleaseDate)" Title="Release Date" />
        <GridColumn Field="@nameof(Product.Active)" />
    </GridColumns>
</TelerikGrid>

@code {
    TelerikGrid<Product> GridRef { get; set; }
    List<Product> GridData { get; set; }

    bool ShouldBindGrid { get; set; }

    async Task OnGridRead(GridReadEventArgs args)
    {
        if (!ShouldBindGrid)
        {
            return;
        }

        await Task.Delay(200); // simulate network delay

        DataSourceResult result = GridData.ToDataSourceResult(args.Request);

        args.Data = result.Data;
        args.Total = result.Total;
        args.AggregateResults = result.AggregateResults;
    }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            // workaround for initial Grid aggregates
            ShouldBindGrid = true;
            GridRef.Rebind();
            StateHasChanged();
        }
    }

    protected override void OnInitialized()
    {
        GridData = new List<Product>();
        var rnd = new Random();

        for (int i = 1; i <= 50; i++)
        {
            GridData.Add(new Product()
            {
                Id = i,
                Name = "Product " + i.ToString(),
                Price = (decimal)rnd.Next(1, 100),
                ReleaseDate = DateTime.Now.AddDays(-rnd.Next(60, 1000)),
                Active = i % 3 == 0
            });
        }
    }

    public class Product
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public decimal Price { get; set; }
        public DateTime ReleaseDate { get; set; }
        public bool Active { get; set; }
    }
}

Unplanned
Last Updated: 20 Feb 2024 06:51 by ADMIN

In this example.  Select a cell in column C.  Then double click on another cell in column C.  The unhandled exception will show up and a null reference exception is logged in the console.  

https://blazorrepl.telerik.com/QHuSQBlj170zO4u130

The exception message is:

System.InvalidOperationException: TelerikValidationComponent requires a cascading parameter of type EditContext. You can use Telerik.Blazor.Components.TelerikValidationTooltip`1[System.String] inside a EditForm or TelerikForm.

Unplanned
Last Updated: 19 Feb 2024 08:51 by Manuel
Created by: Manuel
Comments: 0
Category: Grid
Type: Feature Request
3
Inside the <GridSettings> with <GridGroupableSettings Reorderable=true> to be able to Drag and Drop grouping reorder and not only with "Move Next" and "Move Previous".
Unplanned
Last Updated: 18 Feb 2024 01:03 by Toviana

Please expose an option to configure the field delimiter for CSV export. I want to set semicolon as field delimiter instead of a comma.

---

ADMIN EDIT

---

Internally the Grid uses SpreadStreamProcessing library to perform the export. That said, a necessary prerequisite to implement the current enhancement is that SpreadStreamProcessing supports settings for changing the delimiter when exporting to CSV. You may vote for the item and follow it to get status email updates.

For the time being, you may customize the exported file to set the desired field separator as suggested in the Grid CSV export - change the comma field delimiter knowledge base article.

Planned
Last Updated: 14 Feb 2024 06:52 by ADMIN
Scheduled for 2024 Q2 (May)
Subject says it all.  Would like the ability to selectively enable/disable a single checkbox in a checkbox column.
Unplanned
Last Updated: 13 Feb 2024 10:56 by ADMIN

I have a Grid bound to ObservableCollection and I try to add a new record, the Grid stays in edit mode even if I click the Save button. 

Workaround:

@using System.Collections.ObjectModel
@using Telerik.FontIcons

<TelerikGrid Data="@Cards"
             Height="800px"
             FilterMode="GridFilterMode.FilterRow"
             EditMode="GridEditMode.Inline"
             OnCreate="NewCard"
             OnUpdate="UpdateCard"
             OnDelete="DeleteCard"
             ConfirmDelete="true"
             @ref="@GridReference">
    <GridToolBarTemplate>
        <GridCommandButton Command="Add" Icon="@FontIcon.Plus">New</GridCommandButton>
    </GridToolBarTemplate>
    <GridColumns>
        <GridColumn Field="@nameof(AdminCard.SerialNumber)" Title="Serial number" />
        <GridColumn Field="@nameof(AdminCard.DisplayNumber)" Title="Display number" />
        <GridColumn Field="@nameof(AdminCard.Name)" />
        <GridCommandColumn Width="140px">
            <GridCommandButton Command="Save" Icon="@FontIcon.Save" ShowInEdit="true" />
            <GridCommandButton Command="Edit" Icon="@FontIcon.Pencil" />
            <GridCommandButton Command="Delete" Icon="@FontIcon.Trash" />
            <GridCommandButton Command="Cancel" Icon="@FontIcon.Cancel" ShowInEdit="true" />
        </GridCommandColumn>
    </GridColumns>
</TelerikGrid>

@code {
    TelerikGrid<AdminCard> GridReference { get; set; }

    public ObservableCollection<AdminCard> Cards { get; set; } = new();

    protected override async Task OnInitializedAsync() =>
      Cards = new ObservableCollection<AdminCard>{
        new AdminCard{SerialNumber="123", DisplayNumber="1234 1234", Name="Jim"}
                      };

    private async Task NewCard(GridCommandEventArgs args)
    {
        AdminCard card = (AdminCard)args.Item;
        Cards.Add(card);

        //apply this after saving the new record to the database
        var gridState = GridReference.GetState();
        gridState.InsertedItem = null;
        gridState.OriginalEditItem = null;
        await GridReference.SetStateAsync(gridState);
    }

    private async Task UpdateCard(GridCommandEventArgs args)
    {
        AdminCard fromGrid = (AdminCard)args.Item;
        AdminCard existing = Cards.Single(c => c.Id == fromGrid.Id);
        existing.SerialNumber = fromGrid.SerialNumber;
        existing.DisplayNumber = fromGrid.DisplayNumber;
        existing.Name = fromGrid.Name;
    }

    private async Task DeleteCard(GridCommandEventArgs args)
    {
        AdminCard card = (AdminCard)args.Item;
        Cards.Remove(card);
    }

    public class AdminCard
    {
        public string Id { get; set; } = Guid.NewGuid().ToString();
        public string SerialNumber { get; set; } = "";
        public string DisplayNumber { get; set; } = "";
        public string Name { get; set; } = "";
    }
}

Won't Fix
Last Updated: 08 Feb 2024 14:01 by ADMIN
Created by: Guy
Comments: 1
Category: Grid
Type: Bug Report
1
The MemberType is sometimes not populated correctly
Unplanned
Last Updated: 07 Feb 2024 15:23 by Claudio
Created by: Brian
Comments: 4
Category: Grid
Type: Feature Request
22
I would like to use the endless scrolling feature (like in the Telerik UI for jQuery) with the Telerik Blazor Grid.
Duplicated
Last Updated: 07 Feb 2024 11:23 by ADMIN
I would like to use customization options for the exported file when calling the export programmatically. 
Unplanned
Last Updated: 06 Feb 2024 09:59 by Kyle

Consider this test page: https://blazorrepl.telerik.com/cSEQOTQY53LRL4je36

  1. Check some checkboxes for the Name column and click on the Filter button. This works as expected.
  2. Uncheck all checkboxes in the Name column checkbox list and click on the Filter button again. This time, the previously checked checkboxes remain checked and the filters remain applied.

This happens only when using a column menu - ShowColumnMenu="true".

===

A possible workaround is to use a FilterButtonsTemplate and clear the filters programmatically if the filter descriptor is empty:

@using Telerik.DataSource
@using Telerik.DataSource.Extensions
 
<TelerikGrid TItem="@Employee"
             OnRead="@OnReadHandler"
             Pageable="true"
             FilterMode="@GridFilterMode.FilterMenu"
             FilterMenuType="@FilterMenuType.CheckBoxList"
             ShowColumnMenu="true"
             Height="400px">
    <GridColumns>
        <GridColumn Field="@(nameof(Employee.EmployeeId))" Filterable="false" />
        <GridColumn Field="@nameof(Employee.Name)">
            <FilterMenuTemplate Context="context">
                <TelerikCheckBoxListFilter Data="@NameOptions"
                                           Field="@(nameof(NameFilterOption.Name))"
                                           @bind-FilterDescriptor="@context.FilterDescriptor">
                </TelerikCheckBoxListFilter>
            </FilterMenuTemplate>
            <FilterMenuButtonsTemplate Context="filterContext">
                <TelerikButton OnClick="@( async () => await ApplyFilterAsync(filterContext) )"
                               ThemeColor="primary">Filter</TelerikButton>
                <TelerikButton OnClick="@( async () => await ClearFilterAsync(filterContext) )">Clear</TelerikButton>
            </FilterMenuButtonsTemplate>
        </GridColumn>
        <GridColumn Field="@nameof(Employee.Team)" Title="Team">
            <FilterMenuTemplate Context="context">
                <TelerikCheckBoxListFilter Data="@TeamsList"
                                           Field="@(nameof(TeamNameFilterOption.Team))"
                                           @bind-FilterDescriptor="@context.FilterDescriptor">
                </TelerikCheckBoxListFilter>
            </FilterMenuTemplate>
        </GridColumn>
        <GridColumn Field="@nameof(Employee.IsOnLeave)" Title="On Vacation" />
    </GridColumns>
</TelerikGrid>

@code {
    List<Employee> AllGridData { get; set; }

    #region custom-filter-data
    List<TeamNameFilterOption> TeamsList { get; set; }
    List<NameFilterOption> NameOptions { get; set; }

    private async Task ApplyFilterAsync(FilterMenuTemplateContext filterContext)
    {
        var hasFilters = filterContext.FilterDescriptor.FilterDescriptors.OfType<FilterDescriptor>().Any(x => !string.IsNullOrEmpty(x.Value.ToString()));

        if (hasFilters)
        {
            await filterContext.FilterAsync();
        }
        else
        {
            await filterContext.ClearFilterAsync();
        }
    }

    private async Task ClearFilterAsync(FilterMenuTemplateContext filterContext)
    {
        await filterContext.ClearFilterAsync();
    }

    //obtain filter lists data from the data source to show all options
    async Task GetTeamOptions()
    {
        if (TeamsList == null) // sample of caching since we always want all distinct options,
                               //but we don't want to make unnecessary requests
        {
            TeamsList = await GetNamesFromService();
        }
    }

    async Task<List<TeamNameFilterOption>> GetNamesFromService()
    {
        await Task.Delay(500);// simulate a real service delay

        // this is just one example of getting distinct values from the full data source
        // in a real case you'd probably call your data service here instead
        // or apply further logic (such as tie the returned data to the data the grid will have according to your business logic)
        List<TeamNameFilterOption> data = AllGridData.OrderBy(z => z.Team).Select(z => z.Team).
            Distinct().Select(t => new TeamNameFilterOption { Team = t }).ToList();

        return await Task.FromResult(data);
    }

    async Task GetNameOptions()
    {
        if (NameOptions == null)
        {
            NameOptions = await GetNameOptionsFromService();
        }
    }

    async Task<List<NameFilterOption>> GetNameOptionsFromService()
    {
        await Task.Delay(500);// simulate a real service delay

        List<NameFilterOption> data = AllGridData.OrderBy(z => z.Name).Select(z => z.Name).
            Distinct().Select(n => new NameFilterOption { Name = n }).ToList();

        return await Task.FromResult(data);
    }
    #endregion custom-filter-data

    async Task OnReadHandler(GridReadEventArgs args)
    {
        //typical data retrieval for the grid
        var filteredData = await AllGridData.ToDataSourceResultAsync(args.Request);
        args.Data = filteredData.Data as IEnumerable<Employee>;
        args.Total = filteredData.Total;
    }

    protected override async Task OnInitializedAsync()
    {
        AllGridData = new List<Employee>();
        var rand = new Random();
        for (int i = 1; i <= 15; i++)
        {
            AllGridData.Add(new Employee()
            {
                EmployeeId = i,
                Name = "Employee " + i.ToString(),
                Team = "Team " + i % 3,
                IsOnLeave = i % 2 == 0
            });
        }

        await GetTeamOptions();
        await GetNameOptions();
    }

    public class Employee
    {
        public int EmployeeId { get; set; }
        public string Name { get; set; }
        public string Team { get; set; }
        public bool IsOnLeave { get; set; }
    }

    // in this sample we use simplified models to fetch less data from the service
    // instead of using the full Employee model that has many fields we do not need for the filters

    public class TeamNameFilterOption
    {
        public string Team { get; set; }
    }

    public class NameFilterOption
    {
        public string Name { get; set; }
    }
}

Completed
Last Updated: 06 Feb 2024 09:37 by ADMIN
Release 2024 Q2 (May)

There is a change in the Grid behavior from version 4.6.0 to 5.0.0.

Consider the following REPL test page: https://blazorrepl.telerik.com/cSabmRPy306iPiXK18

Clicking on a Grid cell for editing will not open it for editing if there is already an open cell in edit mode on the same table row. The issue is reproduced more easily if the OnUpdate handler is empty or not defined at all.

This used to work in version 4.6.0.

Unplanned
Last Updated: 05 Feb 2024 12:29 by Constantinos Petridis
Support for IDictionary and value mapper or/and custom implementations of IDictionary
Unplanned
Last Updated: 02 Feb 2024 14:56 by ADMIN

When the page is printed, the Grid is extended down onto multiple sheets of paper. This is because the Grid is large. The issue I am having is that the column headers are not repeating on each printed page. This makes the grid very hard to read. Is there a setting that can force the column headers to print on each printed page?

 

=====ADMIN EDIT=====

Reference: Repeated Table Headers Kendo jQuery.

For Excel export, this depends on: https://feedback.telerik.com/document-processing/1356293-print-titles.

For PDF export, this depends on: https://feedback.telerik.com/blazor/1434269-export-grid-to-pdf.

 

Completed
Last Updated: 30 Jan 2024 13:48 by ADMIN
Release 2024 Q1 (Jan)

The filter list item menu defined as follows do not have accessible name.  Please provide work around or fix that I can implement.

                            <TelerikGrid Data="@ViewModel.RouterAndDataLossInformation" TItem="TrafficLossSummary"
                                                        Pageable="true" 
                                                        Sortable="true" 
                                                        Groupable="false"
                                                        FilterMode="Telerik.Blazor.GridFilterMode.FilterRow"
                                                        Resizable="true" 
                                                        Reorderable="true"
                                                        Height = "100%">

Unplanned
Last Updated: 30 Jan 2024 13:41 by ADMIN

I have a Grid using checkbox selection and when I un-check a row, the SelectedItemsChanged event is not firing. I'm using an async handler.

The problem appears to happen when a row is selected and then un-selected. The event is firing when it is selected but is not firing when it is un-selected.

<TelerikGrid Data="strategicLevelItems" SelectedItems="selectedStrategic" Width="100%" Height="500px"
                                 ScrollMode="GridScrollMode.Scrollable" SelectionMode="GridSelectionMode.Multiple"
                                 SelectedItemsChanged="@((IEnumerable<GetNavigationNodesModel> strategicItems) => OnStrategicSelectAsync(strategicItems))"
                                 FilterMode="GridFilterMode.FilterRow">
                        <GridColumns>
                            <GridCheckboxColumn SelectAll="true" Width="40px" OnCellRender="@GridHelpers.CenterAlign" />
                            <GridColumn Field="@(nameof(GetNavigationNodesModel.Name))" />
                        </GridColumns>
                    </TelerikGrid>

    private async Task OnStrategicSelectAsync(IEnumerable<GetNavigationNodesModel> selectedItems)
    {
        selectedStrategic = selectedItems;

        var state = tacticalGrid.GetState();

        var compositeFilter = new CompositeFilterDescriptor() { LogicalOperator = FilterCompositionLogicalOperator.Or };
        foreach (var item in selectedItems)
        {
            compositeFilter.FilterDescriptors.Add(new FilterDescriptor()
            {
                Member = "ParentId",
                Operator = FilterOperator.IsEqualTo,
                Value = item.Id
            });
        }

        state.FilterDescriptors.Clear();
        state.FilterDescriptors.Add(compositeFilter);

        await tacticalGrid.SetState(state);
    }

Unplanned
Last Updated: 25 Jan 2024 15:52 by ADMIN
Created by: Liero
Comments: 3
Category: Grid
Type: Feature Request
11

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.

---

1 2 3 4 5 6