I'm trying to use the FilterMenu with the CheckBoxListFilter, and it seems like it's sooo close to what I want, if it only had an option for FieldText and FeildValue or something like that. Any way I can get this working to use the ID field as the value and the Name as the text? The highlighted section below is what I would envision it working perfectly as.

Are there any plans to have the datagrid be both groupable and draggable?

Thanks,

Andy

Hello

What is the purpose of this (https://docs.telerik.com/blazor-ui/components/grid/selection/overview#row-drag-and-drop);

Row Drag and Drop

If the user drags selected rows, the current row selection will be cleared on row drop.

Is this a bug? As when you select multiple rows, then drag and drop the rows, it clears the bound selectedItems object (but the rows still remain ticked in the UI). Just confirming this is something that will be fixed?

Cheers

Phil

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; } = "";
    }
}

When you zoom out, the span that displays the Grid pager's content has its style set to display: none, and it does not always reappear when you zoom in after that.

Reproduction

It seems that the issue appeared after upgrading to Telerik 5.0 from 4.6.

When using a Grid with a locked column and column virtualization enabled, focusing cell from that locked column breaks the layout on horizontal scrolling.

The Grid is supposed to show a loading animation when it detects a data operation that requires more than 600ms to complete. However, if this operation is triggered programmatically through the state and not through the UI, the loading indicator is not shown.

Reproduction: https://blazorrepl.telerik.com/mSuPQpvx498wHvV816.

===

ADMIN EDIT

===

A possible workaround for the time being is to use a LoaderContainer component when invoking programmatic data operation similar to how the initial loader is shown here: https://demos.telerik.com/blazor-ui/grid/loading-animation.

The header cell includes the following inner elements when the Grid is sortable:

However, if I disable sorting all those elements are omitted which is not consistent.

Hi,

 when using SetStateAsync(), OnRead is called ok, but loading indicator is not presented as usual.

How to reproduce:

1. button = loading data by SetStateAsync(), no progress indicated.

2. button = loading data throught rebind, is ok

demo in repl

demo is based on https://docs.telerik.com/blazor-ui/components/grid/refresh-data

Expected: same behavior as by button 2.  -> Rebind()->OnRead()...loading progress

Thanks

Reproduceable example: https://blazorrepl.telerik.com/QSEganvg12BVw2ZU37

Steps to reproduce:

• Add a TelerikGrid to the page - most properties on the grid do not matter for this issue
• Implement the OnStateInit event
• Define the GridAggregates render fragment within the TelerikGrid, but leave it empty - do not put any components inside it
• When the page initializes, note that OnStateInit is never fired

If you remove the GridAggregates emtpy render fragment, or put at least one GridAggregate component in it, OnStateInit fires like expected.

In my project, I've created a component that wraps around the TelerikGrid that I use on all my pages, so that I can have many properties and functions set to reasonable defaults for my use case. My component has an option to conditionally include GridAggregate components within the inner TelerikGrid's GridAggregates render fragment based on separate configuration. If no separate configuration is provided, no GridAggregate components are included, and the GridAggregates render fragment is left blank. Since my component is built in razor markup, there isn't a great option for nulling out that render fragment if it's empty. I had no problems with this exact same code in UI for Blazor version 5.1, and I hope this can be fixed.

We have a grid with a GridCheckboxColumn that we have configured through a '.unselectable-row' style so that certain elements cannot be selected (those elements with a padlock in the second column cannot be selected).

The grid works correctly in isolation, but when we add a TelerikLoaderContainer that is displayed during data loading process, the grid doesn't working properly: it is possible to select all the enabled elements of the grid using the button in the header of the checkbox column. However it is not possible to deselect them from the button in the header of the checkbox column when there is any unselectable element.

Here it is a link to REPL with a reproducible example: https://blazorrepl.telerik.com/GyYhYXPI24gIYgIJ03

To reproduce the problem, you sholud select all grid elements from the checkbox column header button and try to deselect them. You will not be able to deselect all the elements. 
Now comment the LoaderContainer component and repeat the test. You will see that now it is possible to deselect correctly all the elements.

How can we deselect all the elements from the header while keeping the loadercontainer?