Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxGrid.PageIndex Property

Specifies the active page index.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[DefaultValue(0)]
[Parameter]
public int PageIndex { get; set; }

#Property Value

Type Default Description
Int32 0

A zero-based value that specifies the active page index.

#Remarks

Use the PageIndex property to switch between Grid pages in code. You can handle the PageIndexChanged event to respond to page index changes.

@using Microsoft.EntityFrameworkCore
@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory
@implements IDisposable

<DxGrid Data="@Data" PageSize="5"
        @bind-PageIndex="@GridPageIndex">
    <Columns>
        <DxGridDataColumn FieldName="ShipName" />
        <DxGridDataColumn FieldName="ShipCity" />
        <DxGridDataColumn FieldName="ShipCountry" />
        <DxGridDataColumn FieldName="Freight" />
        <DxGridDataColumn FieldName="OrderDate" />
        <DxGridDataColumn FieldName="ShippedDate" />
    </Columns>
</DxGrid>

@code {
    object Data { get; set; }
    NorthwindContext Northwind { get; set; }
    int GridPageIndex { get; set; } = 1;

    protected override void OnInitialized() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        Data = Northwind.Orders.ToList();
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}

Blazor Grid Page Index

Run Demo: Data Grid - Paging

For more information about paging in the Grid component, refer to the following topic: Paging in Blazor Grid.

#Implements

See Also