It is impractical to set the grid columns to fixed width. I'll explain with example:

I have grid with 4 columns. The grid should have width 100%.

- Column 1: short text, 10-15 characters. I need this one to auto width to content.

- Column 2: checkbox, also auto-width to header title.

- Column 3: free text that may wrap on multiple lines. I need this column to use all available horizontal space so it will push the 4th column to the very right.

- Column 4: button. auto-width to either header title or button width, whichever is wider.

The auto-width feature is already requested: Autofit column widths on data load (telerik.com) but I don't see a feature request to handle the Column 3 scenario.

Grid - Import from Clipboard (Excel) when column name matches the first row header

I think it would be a great feature to be able to import copied data from excel into the grid either based on the index of the column or the header row in the clipboard matches the name of the column in Blazor Grid.

---

ADMIN EDIT

You can find an example of implementing this and the caveats it brings in the following sample project: https://github.com/telerik/blazor-ui/tree/master/grid/paste-from-excel

This feature requires research on how we could provide it as a built-in feature. So, any feedback on the matter will be appreciated.

---

It is a common request to show grids in alternating colors, rather than simply white and grey.  Because the Grid component generates the <tr> element, we are left with manually setting each <td> element.  A tedious but effective solution.

The feature I would like to request is to add 2 new tags to the <TelerikGrid> component, call them EvenRowClass, and OddRowClass.  The behavior is the same as the Class tag, but they operate on Even and Odd numbered rows of data, respectively.  Their values would be added to the <tr> element as <tr class="MyEvenClass"> or <tr class="MyOddClass" in the same manner class k-alt is generated or not.  This would provide a simple yet extensible mechanism to achieve custom alternating row colors in a Grid.

Reordering rows with RowDraggable is great but tricky.

Droping while the red line marker is on the upper line of a row works.

Droping while the red line marker is on the bottom line of a row brings the item to the position over the dopped line.

Thus, it is impossible to bring a line to the last position of a table (although one can bring the last row over it's predecessor as a workaround)

In Grid with MultiColumnHeaders, if you programmatically change a column header, this breaks the Grid rendering. The header text isn't updated unless the number of child columns changes.

Reproduction steps:

1. Run the provided code snippet. It will bind August's data to the grid. There are 5 days in August's data, so you can see 5 child columns under "Sales by Date".

2. Click the July button. July's data also has 5 days. You will see all the cell texts are updated, but the header texts aren't.

3. If you click on the July button again. They are updated at this time.

4. Refresh the page

5. Click the June button. June's data has only 3 days, so you will see all the header texts, and the cell texts are updated as expected.

Reproduction code:

<TelerikButton OnClick="@Change0">August</TelerikButton>
<TelerikButton OnClick="@Change">July</TelerikButton>
<TelerikButton OnClick="@Change2">June</TelerikButton>

@if (AllSales.Count > 0)
{
    <TelerikGrid @ref="@Grid" Data="@AllSales" Pageable="false">
        <GridColumns>
            <GridColumn Field="@nameof(MyViewModel.Product)">
            </GridColumn>
            <GridColumn>
                <HeaderTemplate>
                    <div>Sales by Date</div>
                </HeaderTemplate>
                <Columns>
                    @{
                        var dates = AllSales.First().SalesByDate.Keys.OrderByDescending(d => d).ToList();
                        foreach (var date in dates)
                        {
                            <GridColumn Title="@date.ToString("MM/dd")">
                                <HeaderTemplate>
                                    @{
                                        Console.WriteLine(date.ToString("MM/dd"));
                                        <div>@date.ToString("MM/dd")</div>
                                    }
                                </HeaderTemplate>
                                <Template>
                                    @{
                                        var record = context as MyViewModel;
                                        if (record.SalesByDate.ContainsKey(date))
                                        {
                                            <div>@record.SalesByDate[date]</div>
                                        }
                                    }
                                </Template>
                            </GridColumn>
                        }
                    }
                </Columns>
            </GridColumn>
        </GridColumns>
    </TelerikGrid>
}

@code {

    public class MyViewModel
    {
        public string Product { get; set; }
        public Dictionary<DateTime, decimal> SalesByDate { get; set; }
    }

    List<MyViewModel> AllSales { get; set; } = new List<MyViewModel>();
    TelerikGrid<MyViewModel> Grid { get; set; }

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();

        Change0();
    }

    protected void Change0()
    {
        AllSales = new List<MyViewModel>();
        AllSales.Add(new MyViewModel
        {
            Product = "Product A",
            SalesByDate = new Dictionary<DateTime, decimal>
            {
                { new DateTime(2021,08,01), 1000 },
                { new DateTime(2021,08,02), 2000 },
                { new DateTime(2021,08,03), 3000 },
                { new DateTime(2021,08,04), 4000 },
                { new DateTime(2021,08,05), 5000 }
            }
        });
        AllSales.Add(new MyViewModel
        {
            Product = "Product B",
            SalesByDate = new Dictionary<DateTime, decimal>
            {
                { new DateTime(2021,08,01), 1000 },
                { new DateTime(2021,08,02), 2000 },
                { new DateTime(2021,08,03), 3000 },
                { new DateTime(2021,08,04), 4000 },
                { new DateTime(2021,08,05), 5000 }
            }
        });
    }

    protected void Change()
    {
        AllSales = new List<MyViewModel>();
        AllSales.Add(new MyViewModel
        {
            Product = "Product C",
            SalesByDate = new Dictionary<DateTime, decimal>
            {
                { new DateTime(2021,07,01), 1010 },
                { new DateTime(2021,07,02), 2020 },
                { new DateTime(2021,07,03), 3030 },
                { new DateTime(2021,07,04), 4040 },
                { new DateTime(2021,07,05), 5050 }
            }
        });
        AllSales.Add(new MyViewModel
        {
            Product = "Product D",
            SalesByDate = new Dictionary<DateTime, decimal>
            {
                { new DateTime(2021,07,01), 1010 },
                { new DateTime(2021,07,02), 2020 },
                { new DateTime(2021,07,03), 3030 },
                { new DateTime(2021,07,04), 4040 },
                { new DateTime(2021,07,05), 5050 }
            }
        });
    }

    protected void Change2()
    {
        AllSales = new List<MyViewModel>();
        AllSales.Add(new MyViewModel
        {
            Product = "Product E",
            SalesByDate = new Dictionary<DateTime, decimal>
            {
                { new DateTime(2021,06,01), 1100 },
                { new DateTime(2021,06,02), 2200 },
                { new DateTime(2021,06,03), 3300 }
            }
        });
        AllSales.Add(new MyViewModel
        {
            Product = "Product F",
            SalesByDate = new Dictionary<DateTime, decimal>
            {
                { new DateTime(2021,06,01), 1100 },
                { new DateTime(2021,06,02), 2200 },
                { new DateTime(2021,06,03), 3300 },
            }
        });
    }
}

When exporting data from a Grid using ExcelExport, the dates are visible when viewed from Excel, but not when using Open Office or Google Sheets. 

We are getting a problem with grid functionality after upgrading from 2.25 to 2.26. I have attached a test project. To see the problem:

• Run the attached solution
• Click on the "Tree List" menu item
• You will then see a grid at the top of the page
• On the first row, click into the text cell under "Column 2" (to the right)
• Now click into the next cell over at "Column 3"
• Now click again into that same cell
• You get the crash

We did not have this problem before version 2.26.

Just another note on this.

It appears that the presence of the checkbox columns causes the problem. Removing the checkbox columns causes the grid to work fine. Just having one checkbox template column in the grid causes the strange crash behavior in 2.26. Before 2.26, we had no problems with the checkbox templates impacting behavior.

It looks like the built-in validation does not respect clearing the edit item through state.  If you remove invalid edit item through Grid State, the Grid stays in edit mode and the OnRowClick stops firing.

The case is similar when you try to clear an invalid InsertedItem through the Grid State - the Grid probably stays in Insert mode and some events are not firing (for example CUD events).

Hello, 

After just a sort operation, in the event handler of OnStateChanged event, the FilterDescriptors of GridStateEventArgs.GridState is not empty. 

Steps to reproduce : 

1) Implement Grid with OnStateChanged and OnRead : 

<TelerikGrid 
             OnStateChanged="@((GridStateEventArgs<IGetAgences_Agences_Items> args) => OnStateChangedHandler(args))"
             OnRead=@ReadItems

    async Task OnStateChangedHandler(GridStateEventArgs<IGetAgences_Agences_Items> args)
    {
        var filters = args.GridState.FilterDescriptors; // filters are not empty after just a sort opration
      
    }

    async Task ReadItems(GridReadEventArgs args)
    {

        this.LoadData()

        await InvokeAsync(StateHasChanged);
    }

2) Sort a column 

3) The OnStateChanged event is fire

4) In the OnStateChangedHandler,  the filters are not empty : 

Expected behaviors :

If no filters added, the filters of the GridState must be empty 

Thank's

Thomas

Hi,

Please lunch your demo on mobile, and try resizing a column it is very hard or impossible to do it.

Isn't possible to make resizing more pixel sensible around the separator for instance 10 pixels, and add AUTO FIT column/columns in column menu.  

Best regards,

Hi,

Is it possible to use ENTER key to validate a popup filter ? instead of mouse.

Use a shortcut to open filter pop of focused column (cell). Ctrl+F or Ctrl+F3...

Yours,

Based on row values, I want to style the entire row.

It could perhaps be exposed through something like a "<RowDescriptor>" element inside the <GridColumns>

//ADMIN EDIT: We plan to extend this item so that it includes not only row styling, but also the ability to add CSS classes to the cells, without having to use the Template.

Hi,

Is it possible to add a sub menu, in column menu so that the end user can add an aggregate operation (Sum, average...) on any column he wants and the foot panel will be automatically displayed or hidden.

Yours,

Currently, when you open a ColumnMenu, to expand its SubMenus (for example, Filter, Column chooser) you need to additionally click on the corresponding button.

I'd like to have these SubMenus initially expanded when the ColumnMenu is opened.