Simplest repro code is below - expand a few rows and select items in them, or in the parent grid. I would expect that selection in each grid is independent, but the child grid seems to control the parent selection too, even though it is disabled.

<TelerikGrid Data="salesTeamMembers" PageSize="4" Pageable="true" @bind-SelectedItems="@SelectedItemsMainGrid" SelectionMode="@GridSelectionMode.Single">
    <DetailTemplate>
        @{
            var employee = context as MainModel;
            <TelerikGrid Data="employee.Orders" Pageable="true" PageSize="7" SelectionMode="@GridSelectionMode.None">
                <GridColumns>
                    <GridColumn Field="OrderId"></GridColumn>
                    <GridColumn Field="DealSize"></GridColumn>
                </GridColumns>
            </TelerikGrid>
        }
    </DetailTemplate>
    <GridColumns>
        <GridColumn Field="Id"></GridColumn>
        <GridColumn Field="Name"></GridColumn>
    </GridColumns>
</TelerikGrid>

@foreach (var item in SelectedItemsMainGrid)
{
    <div>@item.Name</div>
}

@code {
    List<MainModel> salesTeamMembers { get; set; }
    public IEnumerable<MainModel> SelectedItemsMainGrid { get; set; } = Enumerable.Empty<MainModel>();

    protected override void OnInitialized()
    {
        salesTeamMembers = GenerateData();
    }

    private List<MainModel> GenerateData()
    {
        List<MainModel> data = new List<MainModel>();
        for (int i = 1; i < 16; i++)
        {
            MainModel mdl = new MainModel { Id = i, Name = $"Name {i}" };
            mdl.Orders = Enumerable.Range(1, 15).Select(x => new DetailsModel { OrderId = x, DealSize = x ^ i }).ToList();
            data.Add(mdl);
        }
        return data;
    }

    public class MainModel
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public List<DetailsModel> Orders { get; set; }
    }

    public class DetailsModel
    {
        public int OrderId { get; set; }
        public double DealSize { get; set; }
    }
}

I'm following your example listed here (in ObservableCollection section)

https://docs.telerik.com/blazor-ui/components/grid/selection/overview

The following scenario does not work.

Select an item in the grid.

Clear data set. Grid (simplified) look like this. Notice that the checkbox is selected even though nothing is in the grid.


Uncheck chekcbox.
Check checkbox -> All items from the previous data set will be selected (printed in ul bellow grid)

I have inspected the grid and i does not contain any item in its Data collection so I'm unsure from where does it get the selection.



Best regards,
Robert

Likely related to https://feedback.telerik.com/blazor/1432615-support-for-nested-complex-models 

Issue - Filtering / Sorting on a column that is bound to a complex object fails to generate the proper OData string.

Example Grid Code, three columns, column 1 and 3 are bound to a complex class, column 2 just a string:

<TelerikGrid Data=@sysVars.Dtos Pageable="true" Sortable="true" FilterMode="Telerik.Blazor.GridFilterMode.FilterRow" PageSize="20" TotalCount=@sysVars.Count OnRead=@ReadItems>
        <GridColumns>
            <GridColumn Field=@nameof(SysVar.SysVarType.Name) Title="Type" Editable="false">
                <Template>
                    @{
                        var data = context as SysVar;
                        @data.SysVarType.Name
                    }
                </Template>
            </GridColumn>
            <GridColumn Field=@nameof(SysVar.Value) Title="Value">
                <Template>
                    @{
                        var data = context as SysVar;
                        var link = SysVarDto.FrontEndEditUrl(data.Id.Value);
                        <NavLink href=@link>@data.Value</NavLink>
                    }
                </Template>
            </GridColumn>
            <GridColumn Field=@nameof(SysVar.Hierarchy.Description) Title="Hierarchy">
                <Template>
                    @{
                        var data = context as SysVar;
                        @data.Hierarchy.Description
                    }
                </Template>
            </GridColumn>
        </GridColumns>
    </TelerikGrid>

The values bound to the grid are made up of a complex object.  For the sake of the example

 public class SysVar 
    {
        public string Value { get; set; }

        public Hierarchy Hierarchy { get; set; }

        public SysVarType SysVarType { get; set; }
}

public class Hierarchy 
{
      public string Description { get; set; }
}

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

Right now I know I can't have the Grid render SysVarType.Name, so I use a custom cell and everything works.  However, if I try to sort/filter on my complex columns, SysVarType or Hierarchy the resulting OData string that is generated is incorrect.

Example of what is should look like, from a Telerik Grid in my React application if I sort on the sysVarType column:

https://localhost:44335/odata/v1/SysVarOData?$count=true&$expand=sysVarType($select=name),hierarchy($select=description)&$skip=0&$top=20&$orderby=value,sysVarType/name

Same string generated by the Telerik Grid in Blazor

https://localhost:44335/odata/v1/SysVarOData?$count=true&$expand=sysVarType($select=name),hierarchy($select=description)&$skip=0&top=20&$orderby=Name

Note: I can't sort two columns at the same time, not a huge issue at this time.

What is failing is the $orderby= doesn't return sysVarType/name and only returns name, causing a 400 on my backend as the class SysVar doesn't have a name field.

I want to expand on another feature request regarding grid excel behaviour.

Like in excel moving into cell enables edit mode. Using arrow keys or enter key moves out of edit mode and do an automatic update of cell. Escape cancels the editing.

With Wpf you have can extend the grid behaviour in order to do things like moving to the beginning of first column of next row when you are on the last column of row and you press the right arrow / tab / enter key

Hi,

when scrolling all the way down on a grid and then using horizontal scroll, grid is scrolled vertically a bit.

Here is the video

https://drive.google.com/file/d/16GXvUO9Q9kTI2MSkn2t8_9-2ZBn44QO6/view?usp=sharing

Best regards,

Robert

The GridCheckboxColumn for the Blazor Grid is simply confusing.

I think 99 % of the users assume the GridCheckboxColumn is intended to be used for boolean field types.

Functionality is very nice but naming could be e.g. "GridSelectionColumn" to clarify what's it's purpose.

At the moment the numeric and date filters keep the filter button visible even on narrow columns. This must be implemented for the string filter as well - it has a set width at the moment.

The "clear filter" button must always be visible as well (when there is a filter applied, of course).

Ideally, the filter elements will also have a common container with an accessible class so, for example, you can set its max-width to 50% or 100px to match desired UI easily without hacking through several different layouts and selectors.

Hiding a grid column causes data columns to be misaligned with headers.

The issue can be reproduced by clicking the "Show/Hide Summary Column" button in the following demo:

https://demos.telerik.com/blazor-ui/grid/columns?_ga=2.267353678.1156651629.1582659795-849992649.1561742093&_gac=1.10628864.1582231358.EAIaIQobChMIvOnSjf_g5wIVFbvsCh2MAgevEAAYASAAEgLEYvD_BwE

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,

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 :)

Consider the following scenario:

<TelerikGrid Data="Animals" Sortable="true">
  <TelerikGridColumns>
    <TelerikGridColumn Field="Color"></TelerikGridColumn>
    <TelerikGridColumn Field="Breed"></TelerikGridColumn>
  </TelerikGridColumns>
</TelerikGrid>

@functions {
  public List<Animal> Animals { get; set; } = new List<Animal> { new Dog { Breed = "Sheepdog", Color = "Black" } };

  public class Animal { public string Color { get; set; } }
  public class Dog : Animal { public string Breed { get; set; } }
}

Everything renders fine for the grid until you attempt to sort by Breed, which results in the following exception:

Not sure what is going on under the hood here, but perhaps this could be fixed by looking at the type of the object, rather than the underlying list?    I'm aware that this can be fixed by changing the data source to List<Dog> , but I think this use case of using a base-class is useful for many dynamic scenarios (think dynamic columns, etc)

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.

I would like to request these features on the Blazor Grid:

• Add column pinning/freezing
• Add selectable column totals sum/min/max/count/avg functions and/or a way to define custom column totals calculations

Thanks.