Features
This page helps you start working with DHTMLX Pagination and explore its functionality in depth.
How to start with DHTMLX Pagination
In this section you will learn how to initialize Pagination with different data components and integrate it into your applications.
Initialization
| Topic | Description |
|---|---|
| Basic initialization | Learn how to initialize Pagination on a page |
| Pagination with DataView | The example shows how to initialize DataView inside Pagination |
| Pagination with Grid | The example shows how to initialize Grid inside Pagination |
| Pagination with List | The example shows how to initialize List inside Pagination |
| Pagination with Tree | The example shows how to initialize Tree inside Pagination |
| Pagination with Grid in the TreeGrid mode | The example shows how to initialize Grid in the TreeGrid mode inside Pagination |
Integration
| Topic | Description |
|---|---|
| Backend integration | Learn how to connect DHTMLX Suite to a backend (Demo) |
| Optimus | Learn how to use the DHTMLX Optimus framework to build DHTMLX-based apps (the recommended framework for apps with Suite components) |
| React integration | Learn how to use DHTMLX Pagination with React (Demo) |
| Angular integration | Learn how to use DHTMLX Pagination with Angular (Demo) |
| Vue integration | Learn how to use DHTMLX Pagination with Vue.js (Demo) |
How to configure Pagination
In this section you will learn how to specify the initial page of Pagination and define the size of pages.
| Topic | Description |
|---|---|
| Setting initial page | Learn how to define the initial page of the pagination (Example) |
| Configuring page size | Learn how to define the number of items that the related widget displays per page (Example) |
How to customize Pagination
In this section you will learn how to change the style of Pagination, align elements inside it, and configure the width of its input.
| Topic | Description |
|---|---|
| Aligning elements | The example shows how to align elements in Pagination |
| Setting width of input | Learn how to configure the width of the Pagination input (Example) |
| Styling Pagination | Learn how to customize Pagination (Example) |
| List of CSS classes | The CSS classes included in the DHTMLX library |
How to work with Pagination
In this section you will learn how to set the active page dynamically, specify the number of items on each page, get the total number of pages, and more.
| Topic | Description |
|---|---|
| Getting / setting page index | Learn how to set any page as the active page or get the index of the currently active page (Example) |
| Setting number of items displayed per page | Learn how to specify the number of items to display on each page (Example) |
| Getting number of items displayed per page | Learn how to get the count of items displayed per page (Example) |
| Getting total page count | Learn how to get the total number of pages (Example) |
How to work with Pagination events
In this section you will learn how to work with Pagination events.
| Topic | Description |
|---|---|
| Event basic rules | Learn the basic rules of event handling |
| Event handling | Learn how to attach, detach, or call the Pagination events (Example) |
API reference
In this section you will find the Pagination API reference.
| Topic | Description |
|---|---|
| Pagination methods | Check the list of Pagination methods |
| Pagination events | Check the list of Pagination events |
| Pagination properties | Check the list of Pagination properties |
Common functionality
In this section you will learn about common library functionality that is useful when you work with Pagination.
| Topic | Description |
|---|---|
| Touch support | Learn how to work with touch support |
| TypeScript support | Learn how to work with TypeScript |
| AwaitRedraw | Learn how to run code after the component renders |
Any questions left?
Do you need more functionality? Feel free to share your suggestions in the comments below!