Similar to the focusout-event of html-input...I want to do something after leaving a row.

----

ADMIN EDIT

The majority of things are possible through templates right now. You can put in the desired template (editor, row, cell, header, whatever you need to capture events from) and add the desired handler to your own DOM element. Then, you can alter the grid, if needed, through its state. If you need the row data item - it is available in the templates related to the data rows. If you need adjacent rows models - you can get them from the sorted list of grid data when you use its OnRead event - you have the current row and you can get a previous/next one as needed from that list.

That said, I am keeping this item open (status "Unplanned") so we can still gather any feedback and its popularity and what the community thinks, and whether it will be a meaningful addition to the component.

----

Is there any way to default the values that are used when I create a new row?

So for example, I have a row where I want to default a date to Jan 1st of the following year.  However, when I add the row, it adds nulls to all fields and the date shows up as 1 Jan 1900 and there's a lot of fiddly clicking to set the right date.

I recently implemented a Datatable-based grid utilizing the new features/enhancements released in v2.15.0. One notable feature omission that I noticed was the lack of grouping support. I did notice that there was another support item that mentioned OnRead not working with Grouping, but was unsure if that was the reason for the issues I am having or not.

I am using the OnRead() event for building my source from the DataTable, as the demo for using a DataTable shows, and experience a similar issue to that in the referenced support item (empty rows in the grid after attempting grouping, or "nothing" happening, depending on how I try and configure the grid/logic).

Is there a way to do this now, or can this functionality be added?

How can I get the tooltips for validation of each field displayed at the corresponding field in a Grid Popup form, not just the summary below the Form, etc?

---

ADMIN EDIT

---

This will be handled through exposing an option to set your preferred field validation message type - tooltip or inline. It will cover all edit modes (Popup, Inline, InCell).

If you want to remove the ValidationSummary after adding field validation messages, check the ability to remove ValidationSummary from the Popup edit form.

Hi, please expose a property in TelerikGrid where we can set the number of virtual columns to load in advance. A lot of times we would like to load data in advance for 5-10 columns left & right of the current viewport, so the user doesn't see empty columns while scrolling. This may apply to rows as well. It would be very helpful to have this property, please consider exposing it. Thank you.

============

ADMIN EDIT

============

The column Virtualization feature improves the Grid performance when it has a lot of columns. This does not include loading data on demand, but rather UI virtualization. All the data is retrieved and the performance optimization is achieved by rendering only the columns for the current Grid viewport. When the user scrolls horizontally the content for the other columns is rendered and while this happens, the cells appear empty. The requested parameter will control the number of columns that will be rendered in the current viewport but will not be visible until the user scrolls. Thus, the user will not see empty columns.

When storing and restoring grid state, the selected page size is not included as part of that state currently, and needs to be stored seperately.

(When using GridPagerSettings, the user can select the page size based on inputs provided to PageSizes param. This selection is not synced and will revert to default each time the grid is loaded.

Right now you can create a template in the grid to display text from a list based on the foreign key in the grid data. For example, if your database has a table user list and a table role. The Role table has an integer Id primary key column and a text Description column. The user table has a foreign key integer column that is the Role Id. You can bring all the data over when you call up the data (flattening the data) or you can just bring over the foreign key integer value for the role and then create templates.

The situation is described here:

https://docs.telerik.com/blazor-ui/knowledge-base/grids-foreign-key

When you do not flatten the data, you would need to retrieve the role collection and then reference that data in templates in the grid. You need a template for the grid itself, a template for filtering, and a template for the grouping. Maybe more that I am not finding?

What would be great is if you could simply set the foreign key collection for the column and not have to create any templates. You would have to also set what the Id and display text fields are on the collection also so the grid would know what data to use for finding and displaying the desired data. You could require a standard collection with standard field names and then we would have to project the values into it from our other collections using linq.

I need to lock the "expand" column in the Grid(Locked=true).

When I scroll horizontally, the first column with the expand/collapse icon scrolls out of view. I would like a way to lock it.

I'd like for someone to be able to select all of the rows in a particular group. The main selection checkbox will just select all of the rows.

It would be nice if this also worked for sub grouping.

Using OnRowDrop works fine but there is no configuration possible to set the column at the end of the grid.

Of course it's a personnal taste but I like to have the all the actions buttons on the right side

Hi,

 documentation missing one extremely "silent" breaking change in grid data binding.

When binding/refreshing(subsequent reload) data to VARIABLE, there is "random" need to call grid.Rebind(); Mostly, when data are loaded outside of the grid, ie by some button, or another component. Used together with selected items and grouping enabled.

<TelerikGrid Data="@GridData" SelectionMode="GridSelectionMode.Single" SelectedItems="..."
						 OnRowClick="@...r"  @ref="GHL" ....>

prior v6.0, everything is OK:

protected async Task ReloadGrid(int? xid)
{

GridData= await LoadDatafromservice<TItem>...;

}

After upgrading same code, it silently not displaying data or cras.

new breaking behavior at v6.0  - hotfix, but "ugly one":

protected async Task ReloadGrid(int? xid)
{

GridData= await LoadDatafromservice<TItem>...;

GHL.Rebind(); //required, otherwise grid content(rows) is not update. Later the grid crash when selecting row etc. Old "rows" are still displayed;

}

Its weird to gues, where rebind is needed and where not. Previous versions acting as expected(async - task = no problem).
Make it documented, "what is correct" and when.

Or if it is a bug, please move it out from feature request.

Thanks

I would like to lock a column at a certain index in the Grid. For example, I would like to have a column on index 0 (the first column in the Grid) and it should not be reordered by any user interaction (dragging the column itself or dragging other columns in its place). 

Also if the user tries to drag a column over my locked column the drag handlers must not be present/or show that it is an invalid drop location.

===

Telerik edit:

In the meantime, a possible workaround is to:

1. Handle the Grid OnStateChanged event.
2. Check if args.PropertyName is equal to "ColumnStates".
3. Check if the Index of the first Grid column (args.GridState.ColumnStates.First()) is greater than zero.
4. Reset at least 2 column indexes, according to your preferences, so that the first column in the Grid markup is also the first column in the UI.
5. Reset the Grid state with SetStateAsync().

<p>The <strong>Name</strong> column index will always be 0.
    The Grid will either move the reordered column to index 1, or put it back to its previous index (revert).</p>

<p><label><TelerikCheckBox @bind-Value="@ShouldRevertGridColumnOrder" /> Revert Invalid Column Reordering</label></p>

<TelerikGrid @ref="@GridRef"
             Data="@GridData"
             TItem="@SampleModel"
             Pageable="true"
             Sortable="true"
             Reorderable="true"
             OnStateChanged="@OnGridStateChanged">
    <GridColumns>
        <GridColumn Field="@nameof(SampleModel.Name)" Reorderable="false" />
        <GridColumn Field="@nameof(SampleModel.GroupName)" />
        <GridColumn Field="@nameof(SampleModel.Price)" />
        <GridColumn Field="@nameof(SampleModel.Quantity)" />
        <GridColumn Field="@nameof(SampleModel.StartDate)" />
        <GridColumn Field="@nameof(SampleModel.IsActive)" />
    </GridColumns>
</TelerikGrid>

@code {
    private TelerikGrid<SampleModel>? GridRef { get; set; }

    private List<SampleModel> GridData { get; set; } = new();

    private bool ShouldRevertGridColumnOrder { get; set; }

    private IEnumerable<int>? CachedGridColumnIndexes { get; set; }

    private async Task OnGridStateChanged(GridStateEventArgs<SampleModel> args)
    {
        if (args.PropertyName == "ColumnStates")
        {
            if (args.GridState.ColumnStates.First().Index > 0 && GridRef != null)
            {
                if (ShouldRevertGridColumnOrder)
                {
                    await RevertGridColumnOrder();
                }
                else
                {
                    args.GridState.ColumnStates.First(x => x.Index == 0).Index = 1;

                    args.GridState.ColumnStates.First().Index = 0;

                    await GridRef.SetStateAsync(args.GridState);
                }
            }

            CacheGridColumnOrder();
        }
    }

    private void CacheGridColumnOrder()
    {
        var gridColumnState = GridRef?.GetState().ColumnStates;

        if (gridColumnState != null)
        {
            CachedGridColumnIndexes = gridColumnState.Select(x => x.Index);
        }
    }

    private async Task RevertGridColumnOrder()
    {
        var gridState = GridRef?.GetState();

        if (gridState != null && CachedGridColumnIndexes != null)
        {
            for (int i = 0; i < gridState.ColumnStates.Count; i++)
            {
                gridState.ColumnStates.ElementAt(i).Index = CachedGridColumnIndexes.ElementAt(i);
            }

            await GridRef!.SetStateAsync(gridState);
        }
    }

    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            CacheGridColumnOrder();
        }

        base.OnAfterRender(firstRender);
    }

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

        for (int i = 1; i <= 7; i++)
        {
            GridData.Add(new SampleModel()
            {
                Id = i,
                Name = $"Name {i}",
                GroupName = $"Group {i % 3 + 1}",
                Price = rnd.Next(1, 100) * 1.23m,
                Quantity = rnd.Next(0, 1000),
                StartDate = DateTime.Now.AddDays(-rnd.Next(60, 1000)),
                IsActive = i % 4 > 0
            });
        }
    }

    public class SampleModel
    {
        public int Id { get; set; }
        public string Name { get; set; } = string.Empty;
        public string GroupName { get; set; } = string.Empty;
        public decimal Price { get; set; }
        public int Quantity { get; set; }
        public DateTime StartDate { get; set; }
        public bool IsActive { get; set; }
    }
}