radzen-blazor

radzen-blazor copied to clipboard

Describe the bug We have a table which periodically loads data from an API. This happens once on page load, and can also happen by a user triggering a reload without having the page refresh. When the Data gets refreshed, however the table was previously sorted gets reset, which as I understand from the documentation is supposed to be how this works. To counteract this and ensure that the previous sorting settings stay in place even after data is refreshed, I implemented some logic in the SetParametersAsync lifecycle hook. An example component that mirrors the one in our application looks like this:

<RadzenDataGrid Data=@Data
                    TItem=DataType
                    AllowSorting
                    Sort=@HandleOnSort
                    @ref=@dataGridRef
    >
        <Columns>
            <RadzenDataGridColumn TItem=DataType
                                  Property=@(nameof(DataType.StoredValue1))
                                  SortProperty=@(nameof(DataType.StoredValue1))
                                  Title="Value 1"
            >
                <Template Context="item">
                    @item.StoredValue1
                </Template>
            </RadzenDataGridColumn>
            <RadzenDataGridColumn TItem=DataType
                                  Property=@(nameof(DataType.StoredValue2))
                                  SortProperty=@(nameof(DataType.StoredValue2))
                                  Title="Value 2"
            >
                <Template Context="item">
                    @item.StoredValue2
                </Template>
            </RadzenDataGridColumn>
            ...
</RadzenDataGrid>

@code
{
    [Parameter]
    public List<ProviderDistributionData> Data = new();

    private RadzenDataGrid<ProviderDistributionData>? dataGridRef;
    private string? _sortColumn = null;
    private SortOrder? _sortOrder = SortOrder.Ascending;

    public override async Task SetParametersAsync(ParameterView parameters)
    {
        await base.SetParametersAsync(parameters);
       ...Other logic for setting parameters (including Data)

        if (_sortColumn is not null)
        {
            if (_sortOrder == SortOrder.Ascending)
            {
                providerDistributionGrid?.OrderBy(_sortColumn);
            }
            else
            {
                providerDistributionGrid?.OrderByDescending(_sortColumn);
            }
        }
    }

    private void HandleOnSort(DataGridColumnSortEventArgs<ProviderDistributionData> args)
    {
        if (args.SortOrder is not null)
        {
            _sortOrder = args.SortOrder;
        }

        _sortColumn = args.Column.Property;
    }
}

This does not work. Once Data is updated, the table again appears unsorted and all previous applied sort settings are wiped out. Furthermore, this logic seems to break sorting altogether. Clicking on the table headers no longer sorts by that row, as no sorting is applied. From further testing it appears to me that manually setting the Sort method parameter on the data grid is what breaks the sorting on the table, though I'm not sure how or why.

Expected behavior I would expect the usage of OrderBy(columnName) (or OrderByDescending(columnName)) to order the table successfully when called after Data is updated. I also would expect that manually adding logic in the Sort method param would not actively break the sorting across the remainder of the table.

Desktop (please complete the following information):

• OS: Windows 10
• Browser Chrome 119.0.6045.160 (Official Build) (64-bit)
• Version 4.20.0

I also attempted to move the re-sort logic out of the SetParametersAsync and into the other lifecycle methods such as OnAfterRender, to test to see if the table was being re-ordered down the line. That did not seem to solve my issue.