I have various web pages on my website which are using bootstraps (bootstrap 3) pagination but I need to know how to limit the number of pages displayed in it (e.g. display pages 1 to 10 only).
If you then select page 2, page 11 would b displayed and so on.
How do you do this?
I know it will probably be JavaScript/jQuery but any help is appreciated. and if it can be done without having to use JavaScript/jQuery, then all the better.
Below is a screenshot of my pagination.
As you can see there are 12 pages displayed, I would like pages 11 & 12 to be hidden until page 2 or the next page is selected then pages 11 would be displayed and pages one would be hidden, so on and so on.
There is a jquery plugin to work with bootstrap, that solves this problem: http://josecebe.github.io/twbs-pagination/ Have a look at the "visible pages option" section.
You can find more/other solutions with google and bootstrap 3 pagination many pages
.
This question was asked long ago, but it came up while I was looking for an answer.
Specifying max-size='X'
worked for me. The bootstrap pagination tag would look like:
<pagination class="pagination-sm" total-items="1000" items-per-page="10" max-size="10">
</pagination>
Hope this helps someone.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With