Limit the number of pages displayed in bootstrap 3 pagination

javascript jquery css twitter-bootstrap pagination
murday1983 picture murday1983 · Aug 21, 2014 · Viewed 40.6k times · Source

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.

Current 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.

Answer

claus picture claus · Aug 21, 2014

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.

Related questions

How to hide element using Twitter Bootstrap and show it using jQuery?

Let's say I create an HTML element like this, <div id="my-div" class="hidden">Hello, TB3</div> <div id="my-div" class="hide">Hello, TB4</div> <div id="my-div" class="d-none">…

Read More
How to create a toggle button in Bootstrap

I originally created a web app in HTML, CSS and JavaScript, then was asked to create it again in Bootstrap too. I've done it all fine, but I had toggle buttons in the web app that have changed back to …

Read More
TypeError: $(...).modal is not a function with bootstrap Modal

I have a bootstrap 2.32 modal which I am trying to dynamically insert into the HTML of another view. I'm working with Codeigniter 2.1. Following Dynamically inserting a bootstrap modal partial view into a view, I have: <div id="modal_target"&…

Read More