EditRow method fails silently on Nested Inline Grid

Hi There,

The edit button of a nested inline grid only works on the most recently expanded sub-grid.
Interestingly, the problem does not affect the delete button.

Here is a repro Northwind project:

Just thought I'd report in case you want to look into it as I couldn't find a workaround.

PS.. Any hints on how to 'collapse all' upon RowExpand?

Keep up the great work!
Take Care,
Josh

Hi Josh,

I was able to reproduce the issue. The problem was caused by the fact that the hash code of the data items of the most inner DataGrid are changed on subsequent edits. We are using the hash code of the item internally to keep reference to items in edit mode. Honestly I'm not sure what's causing this - usually rebind can cause such problems however this is not the case here. I'll continue to debug the problem and I'll post more info when I have one.

I was wrong. We have this problem: https://github.com/dotnet/aspnetcore/issues/13358 - the last expanded grid @ref wins and this.grid2.EditRow(data); is not correct.

The only option I can suggest you at the moment is to avoid inline editing in hierarchical DataGrid - you can use edit in dialog or navigate instead. We will check if we can enable this (hierarchical inline edit) in some of our future versions.

Here is what we can do. We can add Render event to the DataGrid component (we already have RowRender and CellRender) where you will be able to capture reference to the grid:

page .razor file

..
<RadzenGrid Render="@Render" ...
...

you can save this reference in a dictionary using something unique as a key - in this case OrderID for example:

page partial class - should be added manually

using Radzen.Blazor;
using System.Collections.Generic;

namespace NwBlazor.Pages
{
    public partial class CustomerOrdersComponent
    {
        protected Dictionary<int, RadzenGrid<NwBlazor.Models.Northwind.OrderDetail>> childGrids = 
            new Dictionary<int, RadzenGrid<NwBlazor.Models.Northwind.OrderDetail>>();
    }
}

page .razor.designer.cs file

protected void Render(GridRenderEventArgs<NwBlazor.Models.Northwind.OrderDetail> args)
{
    var order = args.Grid.Data.FirstOrDefault();
    if (order != null && !childGrids.ContainsKey(order.OrderID))
    {
        childGrids.Add(order.OrderID, args.Grid);
    }
}

protected async System.Threading.Tasks.Task EditButtonClick(MouseEventArgs args, dynamic data)
{
    childGrids[data.OrderID].EditRow(data);
}

protected async System.Threading.Tasks.Task SaveButtonClick(MouseEventArgs args, dynamic data)
{
    childGrids[data.OrderID].UpdateRow(data);
}

protected async System.Threading.Tasks.Task CancelButtonClick(MouseEventArgs args, dynamic data)
{
    childGrids[data.OrderID].CancelEditRow(data);

    var northwindCancelOrderDetailChangesResult = await Northwind.CancelOrderDetailChanges(data);
}

Let me know what you think!

2 Likes

I’m impressed. I suspected the prob was that there was only one child grid in the view model and was ready to accept ‘collapse all’ as a solution to sync the view. Did not expect such a complete solution. This is great thank you so much.
Take care.
Josh

PS. To clarify, when you say

We can add Render event to the DataGrid component

Is that a proposed future enhancement?

Or will this code work today?

PSS Perhaps in the more distant future it would make sense to use generate this technique when grids are used in nested templates.

Thanks again

Render event will be added in the next Radzen update (most probably tomorrow). Radzen.Blazor is already published. At the moment there is no hierarchical inline edit template however you can easily replace this.gridXXX with the technique I've described when creating hierarchical grids with inline edit



1 Like

I tried hierarchical inline editing as suggested above but Add New Row is not working i.e childGrids[data.OrderID].InsertRow(data) is not working, Please suggest ASAP