Skip to main content

DxDataGrid<T>.PagerPageSizeSelectorVisible Property

Specifies whether the page size selector is displayed.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.1.dll

Declaration

[Parameter]
public bool PagerPageSizeSelectorVisible { get; set; }

Property Value

Type Default Description
Boolean false

true, to display the page size selector; otherwise, false.

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 page size selector allows users to change the Data Grid’s page size. Once a user selects a new size in this selector, the PageSize property value is updated, and the Data Grid is redrawn.

To display the page size selector, set the PagerPageSizeSelectorVisible property to true. The selector consists of two parts:

  • A list of predefined page sizes. To fill this list, use the PagerAllowedPageSizes property. If the PageSize property value is not added to this list, the value is displayed in the selector’s editor but not available in the selector’s list.
  • The All item. To show it, set the PagerAllDataRowsItemVisible property to true. When a user selects this item, all grid rows are displayed on one page, and the pager is hidden.
<DxDataGrid Data="@DataSource"
            ShowPager="true"
            PagerNavigationMode=@PagerNavigationMode.InputBox
            PagerPageSizeSelectorVisible="true"
            PagerAllDataRowsItemVisible="true"
            PagerAllowedPageSizes=@(new int[] {2,10,20,40})>
    <DxDataGridColumn Field="@nameof(Order.ShipName)" />
    <DxDataGridColumn Field="@nameof(Order.ShipCity)" />
    <DxDataGridColumn Field="@nameof(Order.ShipPostalCode)" />
    <DxDataGridColumn Field="@nameof(Order.ShipCountry)" />
    <DxDataGridColumn Field="@nameof(Order.Freight)" Width="80px" />
    <DxDataGridDateEditColumn Field="@nameof(Order.OrderDate)" DisplayFormat="d" Width="120px" />
    <DxDataGridDateEditColumn Field="@nameof(Order.ShippedDate)" DisplayFormat="d" Width="120px" />
</DxDataGrid>

DataGrid Page Size Selector

Run Demo: Data Grid - Paging

See Also