DataGrid: adding a new inline row does not work in LoadData mode if data is empty. #932

Closed
opened 2026-01-29 17:46:30 +00:00 by claunia · 1 comment
Owner

Originally created by @OndrejUzovic on GitHub (Jul 21, 2023).

Adding a new inline row does not work if data are provided via LoadData and data are empty.

Here is a short example code to reproduce the issue:

@page "/"

@using Radzen;
@using Radzen.Blazor;
@using Microsoft.Extensions.Localization

<div class="row">
    <div class="col-md-3">
        <RadzenButton ButtonStyle="ButtonStyle.Success" Icon="add_circle_outline" class="mt-2 mb-4" Text="Add New Order"
            Click="@OnNewOrderClick"
            Disabled=@myIsEditingInProgress />
        
        <RadzenDataGrid @ref="myGrid" AllowAlternatingRows="false" AllowFiltering="true" EditMode="DataGridEditMode.Single"
                        Data="@myData" LoadData=@OnLoadData Count=@myCount
                        TItem="Order" RowCreate="@OnCreateRowAfterEditing" ColumnWidth="200px">
            <Columns>
                <RadzenDataGridColumn TItem="Order" Property="Name" Title="Name" Width="120px">
                    <EditTemplate Context="order">
                        <RadzenTextBox @bind-Value="order.Name" Style="width:100%; display: block" Name="ShipName" />
                    </EditTemplate>
                </RadzenDataGridColumn>

                <RadzenDataGridColumn TItem="Order" Context="order" Filterable="false" Sortable="false" TextAlign="TextAlign.Right" Width="156px">
                    <Template Context="order">
                        <RadzenButton ButtonStyle="ButtonStyle.Danger" Icon="delete" Variant="Variant.Flat" Shade="Shade.Lighter" Size="ButtonSize.Medium"
                            class="my-1 ms-1"
                            Click="@(args => OnDeleteRowClick(order))" @onclick:stopPropagation="true" Disabled=@myIsEditingInProgress />
                    </Template>
                    <EditTemplate Context="order">
                        <RadzenButton Icon="check" ButtonStyle="ButtonStyle.Success" Variant="Variant.Flat" Size="ButtonSize.Medium" Click="@((args) => OnSaveEditedRowClick(order))" />
                        <RadzenButton Icon="close" ButtonStyle="ButtonStyle.Light" Variant="Variant.Flat" Size="ButtonSize.Medium" class="my-1 ms-1" Click="@((args) => OnCancelEditedRowClick(order))" />
                    </EditTemplate>
                </RadzenDataGridColumn>
            </Columns>
        </RadzenDataGrid>
    </div>
</div>

@code {
    public class Order
    {
        public string Name { get; set; }
    }

    RadzenDataGrid<Order> myGrid;
    bool myIsEditingInProgress;

    List<Order> myStorage;

    IEnumerable<Order> myData;
    int myCount;

    protected override void OnInitialized()
    {
        myStorage = new List<Order>();

        // If the storage is not empty then it works!!!
        //myStorage = new List<Order>() { new Order() { Name = "Hello" } };
    }

    async Task OnSaveEditedRowClick(Order order)
    {
        myIsEditingInProgress = false;
        await myGrid.UpdateRow(order);
    }

    void OnCancelEditedRowClick(Order order)
    {
        myIsEditingInProgress = false;
        myGrid.CancelEditRow(order);
    }

    async Task OnDeleteRowClick(Order order)
    {
        myStorage.Remove(order);
        await myGrid.Reload();
    }

    async Task OnNewOrderClick()
    {
        var newOrder = new Order();
        await myGrid.InsertRow(newOrder);
        myIsEditingInProgress = true;
    }

    void OnCreateRowAfterEditing(Order order)
    {
        myStorage.Add(order);
    }

    async Task OnLoadData(LoadDataArgs args)
    {
        await Task.Yield();

        var query = myStorage.AsQueryable();

        myCount = query.Count();
        myData = query.ToList();
    }
}

Steps to reproduce the problem:

  1. Click "Add New Order"
  2. Problem: the inline row is not added.

image

In case the data is not empty the inline row is correctly added.
image

Originally created by @OndrejUzovic on GitHub (Jul 21, 2023). Adding a new inline row does not work if data are provided via LoadData and data are empty. Here is a short example code to reproduce the issue: ``` @page "/" @using Radzen; @using Radzen.Blazor; @using Microsoft.Extensions.Localization <div class="row"> <div class="col-md-3"> <RadzenButton ButtonStyle="ButtonStyle.Success" Icon="add_circle_outline" class="mt-2 mb-4" Text="Add New Order" Click="@OnNewOrderClick" Disabled=@myIsEditingInProgress /> <RadzenDataGrid @ref="myGrid" AllowAlternatingRows="false" AllowFiltering="true" EditMode="DataGridEditMode.Single" Data="@myData" LoadData=@OnLoadData Count=@myCount TItem="Order" RowCreate="@OnCreateRowAfterEditing" ColumnWidth="200px"> <Columns> <RadzenDataGridColumn TItem="Order" Property="Name" Title="Name" Width="120px"> <EditTemplate Context="order"> <RadzenTextBox @bind-Value="order.Name" Style="width:100%; display: block" Name="ShipName" /> </EditTemplate> </RadzenDataGridColumn> <RadzenDataGridColumn TItem="Order" Context="order" Filterable="false" Sortable="false" TextAlign="TextAlign.Right" Width="156px"> <Template Context="order"> <RadzenButton ButtonStyle="ButtonStyle.Danger" Icon="delete" Variant="Variant.Flat" Shade="Shade.Lighter" Size="ButtonSize.Medium" class="my-1 ms-1" Click="@(args => OnDeleteRowClick(order))" @onclick:stopPropagation="true" Disabled=@myIsEditingInProgress /> </Template> <EditTemplate Context="order"> <RadzenButton Icon="check" ButtonStyle="ButtonStyle.Success" Variant="Variant.Flat" Size="ButtonSize.Medium" Click="@((args) => OnSaveEditedRowClick(order))" /> <RadzenButton Icon="close" ButtonStyle="ButtonStyle.Light" Variant="Variant.Flat" Size="ButtonSize.Medium" class="my-1 ms-1" Click="@((args) => OnCancelEditedRowClick(order))" /> </EditTemplate> </RadzenDataGridColumn> </Columns> </RadzenDataGrid> </div> </div> @code { public class Order { public string Name { get; set; } } RadzenDataGrid<Order> myGrid; bool myIsEditingInProgress; List<Order> myStorage; IEnumerable<Order> myData; int myCount; protected override void OnInitialized() { myStorage = new List<Order>(); // If the storage is not empty then it works!!! //myStorage = new List<Order>() { new Order() { Name = "Hello" } }; } async Task OnSaveEditedRowClick(Order order) { myIsEditingInProgress = false; await myGrid.UpdateRow(order); } void OnCancelEditedRowClick(Order order) { myIsEditingInProgress = false; myGrid.CancelEditRow(order); } async Task OnDeleteRowClick(Order order) { myStorage.Remove(order); await myGrid.Reload(); } async Task OnNewOrderClick() { var newOrder = new Order(); await myGrid.InsertRow(newOrder); myIsEditingInProgress = true; } void OnCreateRowAfterEditing(Order order) { myStorage.Add(order); } async Task OnLoadData(LoadDataArgs args) { await Task.Yield(); var query = myStorage.AsQueryable(); myCount = query.Count(); myData = query.ToList(); } } ``` Steps to reproduce the problem: 1. Click "Add New Order" 2. Problem: the inline row is not added. ![image](https://github.com/radzenhq/radzen-blazor/assets/55758368/eb28914f-1a1d-428e-99fc-b02f6c65f57f) In case the data is not empty the inline row is correctly added. ![image](https://github.com/radzenhq/radzen-blazor/assets/55758368/76c0f463-72de-4d0c-8709-312dc1e2364b)
Author
Owner

@enchev commented on GitHub (Jul 21, 2023):

Duplicate to https://github.com/radzenhq/radzen-blazor/issues/365

@enchev commented on GitHub (Jul 21, 2023): Duplicate to https://github.com/radzenhq/radzen-blazor/issues/365
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/radzen-blazor#932