Pagination
Standalone pagination control. Use in card grids, search results, and any list outside the DataTable. Configurable boundary and sibling counts decide when ellipses appear.
Default
500 items, 20 per page = 25 pages
razor
<Pagination CurrentPage="@_page"
CurrentPageChanged="@((int p) => _page = p)"
TotalItems="500"
PageSize="20" />Many pages — ellipsis kicks in
2000 items / 20 per page = 100 pages
Boundary and sibling counts collapse the middle into ellipses, keeping the control compact.
razor
@* Same component, larger TotalItems triggers ellipsis automatically *@
<Pagination CurrentPage="@_page"
CurrentPageChanged="@((int p) => _page = p)"
TotalItems="2000"
PageSize="20" />With page-size selector
Set ShowPageSize="true" to expose a per-page dropdown
razor
<Pagination CurrentPage="@_page"
CurrentPageChanged="@((int p) => { _page = p; LoadResults(); })"
TotalItems="@_total"
PageSize="@_pageSize"
PageSizeChanged="@((int s) => _pageSize = s)"
ShowPageSize="true"
PageSizeOptions="@(new[] { 10, 20, 50, 100 })" />