Implement Saving of columns in DataGrid

Radzen.Blazor Components
1

I have a working solution for saving columns in a DataGrid, but I cant set the PickedColumnsChanged handler properly without doing the below, which does work

 <RadzenDataGrid @ref=dataGrid PickedColumnsChanged="@(EventCallback.Factory.Create<DataGridPickedColumnsChangedEventArgs<CurrentRuleRow>>(this, OnPickedColumnsChanged))" AllowPickAllColumns=true AllowColumnPicking="true" 
    AllowSorting="true" PageSize="20" AllowPaging="true" PagerHorizontalAlign="HorizontalAlign.Center" PagerPosition="PagerPosition.Bottom"
    Data=@Result.Rules LogicalFilterOperator="LogicalFilterOperator.Or" SelectionMode="DataGridSelectionMode.Single">

and handler

    async Task OnPickedColumnsChanged(DataGridPickedColumnsChangedEventArgs<CurrentRuleRow> args)
    {
        activeColumns = args.Columns.Select(x => x.Title).ToList();
        await localStorage.SetItemAsync<List<string>>(Constants.CurrentRuleColumns, activeColumns);
    }

I above does work but its ugly, and feels wrong.

if I set it like I see in lots of examples I get this build error in VS2022

PickedColumnsChanged="@OnPickedColumnsChanged"

Argument 2: cannot convert from 'method group' to 'Microsoft.AspNetCore.Components.EventCallback'

Issue no2 is that im loading the columns like this

    async Task SetColumns() 
    {
        activeColumns = await localStorage.GetItemAsync<List<string>>(Constants.CurrentRuleColumns);

        if (activeColumns == null)
            return;

        foreach (var col in dataGrid.ColumnsCollection) 
        {
            col.Visible = activeColumns.Any(x => col.Title == x);
        }
    }

which works, but I get a warning about not setting visible outside of its component, all works fine though.

Is there any working example of how to do this "correctly" ? This is in .Net 9

image
image1269×119 37 KB

2

Not sure what’s “saving all columns”, are you looking for save/load settings?

To use generic event arguments also you need to set TItem for the DataGrid.

3

To clarify, saving which columns are picked, ie visible

Thanks for the TItem suggestion!.. that lets me set the handler correctly now

TItem="CurrentRuleRow"

Many thanks.

The last question though, is this bad practice to set the column Visible property like this?

async Task SetColumns() 
    {
        activeColumns = await localStorage.GetItemAsync<List<string>>(Constants.CurrentRuleColumns);

        if (activeColumns == null)
            return;

        foreach (var col in dataGrid.ColumnsCollection) 
        {
            col.Visible = activeColumns.Any(x => col.Title == x);
        }
    }
4

Actually I think I take your point, better to save ALL settings rather than just picked columns..

5

And FYI , if you use the same object property name in "property" in 2 different columns it will cause the page to hang when you you load settings.

And if you have columns that don't have a "Property" set for example a column that is purely used to render a clickable button or something, the settings for these columns are not saved. Adding Fake bool properties to my object class is a good workaround.