Skip to main content
A newer version of this page is available. .

GridPersistentLayoutCollection<T> Class

A collection of objects that store information about DxGrid element layouts.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.1.dll

NuGet Package: DevExpress.Blazor

Declaration

public class GridPersistentLayoutCollection<T> :
    IReadOnlyList<T>,
    IEnumerable<T>,
    IEnumerable,
    IReadOnlyCollection<T>,
    IEquatable<IReadOnlyList<T>>
    where T : IEquatable<T>

Type Parameters

Name Description
T

The type of a layout object that corresponds to the processed element type. For example, the GridPersistentLayoutColumn type is used for Grid columns.

Remarks

The Grid allows you to save and restore the component’s layout when necessary. The saved layout object includes the current page, column sort order/direction, column position, filter values, and grouped columns (information about expanded rows in groups is not included).

A GridPersistentLayoutCollection object defines a collection of layout objects for specific Grid elements (for example, columns). Use the class’s Item[Int32] property to access a collection item. To get the total number of items, use the Count property.

The code below excludes a column’s GroupIndex parameter from the list of saved column layout settings.

@using System.Text.Json
@inject NwindDataService NwindDataService
@inject IJSRuntime JSRuntime

@if(PreRendered) {
    <DxGrid @ref="Grid" Data="@GridData" AutoExpandAllGroupRows="true"
        ColumnResizeMode="GridColumnResizeMode.NextColumn"
        ShowGroupPanel="true" ShowFilterRow="true"
        PageSizeSelectorVisible="true" PageSizeSelectorAllRowsItemVisible="true"
        LayoutAutoLoading="Grid_LayoutAutoLoading"
        LayoutAutoSaving="Grid_LayoutAutoSaving">
        <Columns>
            <DxGridDataColumn FieldName="Country" GroupIndex="0" />
            <DxGridDataColumn FieldName="City" GroupIndex="1" />
            <DxGridDataColumn FieldName="CompanyName" />
            <DxGridDataColumn FieldName="Address" />
            <DxGridDataColumn FieldName="Phone" />
            <DxGridDataColumn FieldName="ContactName" />
        </Columns>
    </DxGrid>
} else {
    <em>Loading...</em>
}

@code {
    const string LocalStorageKey = "Grid-LayoutPersistence-Data";

    bool PreRendered { get; set; }
    IGrid Grid { get; set; }
    object GridData { get; set; }

    protected override async Task OnInitializedAsync() {
        GridData = await NwindDataService.GetCustomersAsync();
    }

    protected override void OnAfterRender(bool firstRender) {
        if(firstRender) {
            PreRendered = true;
            StateHasChanged();
        }
    }

    async Task Grid_LayoutAutoLoading(GridPersistentLayoutEventArgs e) {
        e.Layout = await LoadLayoutFromLocalStorageAsync();
    }

    async Task Grid_LayoutAutoSaving(GridPersistentLayoutEventArgs e) {
        var layout = e.Layout with {
            Columns = new GridPersistentLayoutCollection<GridPersistentLayoutColumn>(
                e.Layout.Columns.Select(i => i with { GroupIndex = null })
            )
        };
        await SaveLayoutToLocalStorageAsync(layout);
    }

    async Task<GridPersistentLayout> LoadLayoutFromLocalStorageAsync() {
        try {
            var json = await JSRuntime.InvokeAsync<string>("localStorage.getItem", LocalStorageKey);
            return JsonSerializer.Deserialize<GridPersistentLayout>(json);
        } catch {
            // Mute exceptions
            return null;
        }
    }

    async Task SaveLayoutToLocalStorageAsync(GridPersistentLayout layout) {
        try {
            var json = JsonSerializer.Serialize(layout);
            await JSRuntime.InvokeVoidAsync("localStorage.setItem", LocalStorageKey, json);
        } catch {
            // Mute exceptions
        }
    }
}

Inheritance

Object
GridPersistentLayoutCollection<T>
See Also