Pagination

• 2 minutes to read

Pagination is a UI component that allows users to navigate through pages.

Run Demo: Pagination Read Tutorial

Getting Started

The Pagination UI Control is based on the DevExtreme Pagination component.

The following help topics explain how to add this control to your project:

• Add DevExtreme to a Visual Studio Project or Configure a non Visual Studio Project
• Add Controls to a Project
• Razor Syntax

Basic Syntax

PaginationBasics.cshtml

@(Html.DevExtreme().Pagination()
    .ItemCount(200)
    .ShowInfo(true)
)

PaginationController.cs

using Microsoft.AspNetCore.Mvc;

namespace ASP_NET_Core.Controllers {
    public class PaginationController : Controller {
        public IActionResult GettingStarted() {
            return View();
        }
    }
}

Built-in Capabilities and Configuration Guides

• Page Navigation Controls
  A page navigator (on the right) allows browsing through pages. Toggle showNavigationButtons to show or hide “prev” and “next” buttons.

• Total Pages Information
  Enable the showInfo property to show paging details.

• Allowed Page Sizes
  Specify the allowedPageSizes property to enable the page size selector (on the left). The default options are 5 and 10 items per page, but you can customize this value.

API

Server-Side API

Initialization

Call the Pagination() method to create a Pagination control. This action initializes a PaginationBuilder instance. Use the instance methods to specify Pagination options and event handlers.

Options

For a complete option list, see PaginationBuilder Members. For details on how to specify control options, refer to the following help topic: Specify Options.

Events

For available events, see Events. For details on how to handle events, refer to the following help topic: Handle Events and Define Callbacks.

Client-Side API

Options

If you need to specify the Pagination options dynamically on the client side, use client-side API. For a complete option list, see DevExtreme Pagination options.

Methods

For a list of available methods, see DevExtreme Pagination methods. For details on how to call methods, refer to the following help topic: Call Methods.

Demos

Run Demo: Pagination