radzen-blazor icon indicating copy to clipboard operation
radzen-blazor copied to clipboard

Inline edit row not work if class inherits other class

Open Sonic3R opened this issue 2 years ago • 0 comments

I'm using latest version of Radzen: 4.1.12

@page "/fetchdata"
@inherits FetchDataBase
@using BlazorApp1.Shared

<PageTitle>Weather forecast</PageTitle>

<h1>Weather forecast</h1>

<p>This component demonstrates fetching data from the server.</p>

<EditForm @ref=@_editForm Model="@_selectedItem">
    <div class="row">
        <div class="col d-flex">
            <RadzenDataGrid @ref=@_grid
                            IsLoading=@_isLoading
                            Count=@_totalItems
                            Data=@_items
                            EditMode="DataGridEditMode.Single"
                            LoadData=@LoadData
                            AllowColumnResize="true"
                            AllowPaging="true"
                            PageSize=@_pageSize
                            PagerAlwaysVisible="true"
                            PagerPosition="PagerPosition.TopAndBottom"
                            PagerHorizontalAlign="HorizontalAlign.Left"
                            AllowSorting="true"
                            TItem="WeatherForecast">
                <EmptyTemplate>
                    <p class="datagrid-no-records">No matching results</p>
                </EmptyTemplate>
                <Columns>
                    <RadzenDataGridColumn TItem="WeatherForecast" Title="Sr. no" TextAlign="TextAlign.Center" Width="70px" Sortable=false>
                        <Template Context="item">
                            <RadzenLabel Text="--" />
                        </Template>
                    </RadzenDataGridColumn>
                    <RadzenDataGridColumn TItem="WeatherForecast" Property="TemperatureC" Title="Temperature" TextAlign="TextAlign.Center" Sortable=false>
                        <EditTemplate Context="item">
                            <CascadingValue Value=@_editForm.EditContext IsFixed="false">
                                <div class="cell-item">
                                    <RadzenTextBox @bind-Value="@item.Temperature" class="w-100 mb-1" />
                                </div>
                            </CascadingValue>
                        </EditTemplate>
                    </RadzenDataGridColumn>
                    <RadzenDataGridColumn TItem="WeatherForecast" Title="Action" TextAlign="TextAlign.Center" Width="100px" Sortable=false>
                        <Template Context="item">
                            <RadzenButton Icon="edit" ButtonStyle="ButtonStyle.Light" class="edit-btn" Size="ButtonSize.Medium" @onclick:stopPropagation="true" Click="@(() => EditRow(item))" />
                        </Template>
                        <EditTemplate Context="item">
                            <RadzenButton Icon="check" ButtonStyle="ButtonStyle.Success" Size="ButtonSize.Medium" Click="@(() => SaveRow(item))" />
                            <RadzenButton Icon="close" ButtonStyle="ButtonStyle.Light" Size="ButtonSize.Medium" Class="my-1 ms-1" Click="@(() => CancelEdit(item))" />
                        </EditTemplate>
                    </RadzenDataGridColumn>
                </Columns>
            </RadzenDataGrid>
        </div>
    </div>
</EditForm>

and

public class FetchDataBase : InlineComponentBase<WeatherForecast>
{
        private static readonly string[] Summaries = new[]
        {
                "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
        };

        protected override WeatherForecast _selectedItem => new WeatherForecast();

        protected override Task LoadDataAsync()
        {
            _items = Enumerable.Range(1, 15).Select(index =>
            {
                var rand = Random.Shared.Next(-20, 55);

                return new WeatherForecast
                {
                    Date = DateTime.Now.AddDays(index),
                    TemperatureC = rand,
                    Temperature = rand.ToString(),
                    Summary = Summaries[Random.Shared.Next(Summaries.Length)]
                };
            }).ToList();

            return Task.CompletedTask;
        }

        protected override Task EditRow(WeatherForecast item)
        {
            _editForm.Model = item;
            return base.EditRow(item);
        }
}

and InlineComponentBase

public abstract class InlineComponentBase<TItem> : ComponentBase where TItem : class
{
        protected List<TItem> _items;
        protected EditForm _editForm;
        protected abstract TItem _selectedItem { get; }
        protected RadzenDataGrid<TItem> _grid;
        protected int _totalItems;
        protected int _page;
        protected readonly int _pageSize = 20;
        protected int _pageNumber = 1;
        protected bool _isLoading;

        protected abstract Task LoadDataAsync();

        protected virtual async Task LoadData(LoadDataArgs args)
        {
            _isLoading = true;

            try
            {
                await LoadDataAsync();
                _totalItems = _items.Count;
            }
            finally
            {
                _isLoading = false;
            }
        }

        protected virtual Task EditRow(TItem item)
        {
            return _grid.EditRow(item);
        }

        protected Task SaveRow(TItem item)
        {
            return _grid.UpdateRow(item);
        }

        protected void CancelEdit(TItem item)
        {
            _grid.CancelEditRow(item);
        }
}

The inline component abstract class I needed to re-use and force other component pages to follow structure.

I created repo here: https://github.com/Sonic3R/RadzenDataGrid to help you to reproduce issue

Repo issue:

  1. Go to Fetch data page from left navigation sidebar
  2. Click on pencil icon to get into edit mode
  3. The EditRow method is called but nothing happened

If I put all codes from InlineComponentBase into FetchDataBase class (of course, without generic using) then edit works.

Do I do something wrong or it is a bug ?

Sonic3R avatar Oct 21 '22 15:10 Sonic3R