• Docs
  • API
  • Help
  • Blog
  • GitHub

›Basic Usage

Getting Started

  • About
  • Getting Started
  • Bootstrap 4
  • Migration

Basic Usage

  • Work on Row
  • Work on Column
  • Table Sort
  • Row Selection
  • Column Filter
  • Cell Edit
  • Pagination
  • Expandable Row

Remote Table

  • Work on Remote
  • Overlay

Table Toolkits

  • Getting Started
  • Table Search
  • Export to CSV

Exposed API

  • Introduction

Pagination

react-bootstrap-table2 separate the pagination code base to react-bootstrap-table2-pagination, so there's a little bit different when you use pagination. In the following, we are going to show you how to enable and configure the a pagination table

Live Demo For Pagination
API & Props Definition


Install

$ npm install react-bootstrap-table2-paginator --save

Add CSS

// es5 
require('react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css');

// es6
import 'react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css';

How

Let's enable a pagination on your table:

import paginationFactory from 'react-bootstrap-table2-paginator';
// omit...

<BootstrapTable keyField='id' data={ products } columns={ columns } pagination={ paginationFactory() } />

Customization

See pagination props

← Cell EditExpandable Row →
Docs
Getting StartedAPI References
Community
Stack OverflowProject ChatTwitter
More
BlogGitHubStar
Copyright © 2018 react-bootstrap-table2.