I am having trouble with the pagination drop down in react-bootstrap-table2.
Here are my options:
const options = {
paginationSize: 4,
pageStartIndex: 0,
//alwaysShowAllBtns: true, // Always show next and previous button
//withFirstAndLast: false, // Hide the going to First and Last page button
// hideSizePerPage: true, // Hide the sizePerPage dropdown always
// hidePageListOnlyOnePage: true, // Hide the pagination list when only one page
firstPageText: 'First',
prePageText: 'Back',
nextPageText: 'Next',
lastPageText: 'Last',
nextPageTitle: 'First page',
prePageTitle: 'Pre page',
firstPageTitle: 'Next page',
lastPageTitle: 'Last page',
sizePerPageList: [{
text: '5', value: 5
},{
text: '10', value: 10
},{
text: 'All', value: this.state.currentlyDisplayed.length
}] // A numeric array is also available. the purpose of above example is custom the text
};Below is how I implemented the Table Component:
<BootstrapTable
className="bsTable"
striped={true}
hover={true}
keyField='id'
data={this.state.currentlyDisplayed}
columns={columns}
pagination={ paginationFactory(options) }
filter={ filterFactory({delay:100}) }
fetchInfo={{dataTotalSize: this.state.currentlyDisplayed.length}}
/>I am hoping to see 5, 10, All in the drop down but it's not responding as expected. My table contains more than 5 records... Any suggestions?