Skip to main content

DxDataGrid<T>.PageCount Property

Gets the total number of pages in the grid.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.1.dll

Declaration

[Parameter]
public int PageCount { get; set; }

Property Value

Type Description
Int32

An integer value that specifies the number of grid pages.

Remarks

Important

The Data Grid was moved to maintenance support mode. No new features/capabilities will be added to this component. We recommend that you migrate to the Grid component.

The DxDataGrid<T> automatically calculates the number of pages required to display all data rows. The maximum number of rows that can be displayed on a page is specified by the PageSize property or a value selected in the page size selector.

The PageCount value changes when you group/ungroup grid data, or expand/collapse detail rows. To handle the PageCount change, use the PageCountChanged event.

The code below demonstrates how to use the DxPager editor as an external pager for the Data Grid component.

<div class="p-2">
    <DxPager ActivePageIndex="@pageIndex" ActivePageIndexChanged="@OnActivePageIndexChanged" PageCount="@pageCount"></DxPager>
</div>
<DxDataGrid @ref="@grid"
            DataAsync="@ForecastService.GetForecastAsync"
            ShowPager="false"
            PageSize="5"
            PageIndex="@pageIndex"          
            PageCountChanged="@OnPageCountChanged">
    <DxDataGridCommandColumn Width="150px"></DxDataGridCommandColumn>
    <DxDataGridDateEditColumn Field="@nameof(WeatherForecast.Date)"></DxDataGridDateEditColumn>
    <DxDataGridColumn Field="@nameof(WeatherForecast.Forecast)"></DxDataGridColumn>
    <DxDataGridSpinEditColumn Field="@nameof(WeatherForecast.TemperatureC)"></DxDataGridSpinEditColumn>        
    <DxDataGridComboBoxColumn Field="@nameof(WeatherForecast.CloudCover)" DataAsync="@ForecastService.GetCloudCoverAsync"></DxDataGridComboBoxColumn>
    <DxDataGridCheckBoxColumn Field="@nameof(WeatherForecast.Precipitation)"></DxDataGridCheckBoxColumn>
</DxDataGrid>

@code {
    int pageIndex;
    int pageCount;
    DxDataGrid<WeatherForecast> grid;

    protected override void OnInitialized() {
        base.OnInitialized();
        pageIndex = 0;
    }

    protected override void OnAfterRender(bool firstRender) {
        base.OnAfterRender(firstRender);
        pageCount = grid.PageCount;
    }

    void OnActivePageIndexChanged(int newPageIndex) {
        pageIndex = newPageIndex;
    }

    void OnPageCountChanged(int newPageCount) {
        pageCount = newPageCount;
        InvokeAsync(StateHasChanged);
    }
}

DataGrid External Pager

See Also