How to create pagination in Bootstrap?

This jQuery plugin "twbsPagination()" simplifies the usage of Bootstrap Pagintion.

Plugin requires jQuery (required - 1.7.0 or higher).

You can use Bootstrap CSS styles and markup (or use your own).

More details available here

Add this lines in to your HTML code
<div class="well PageContent"></div>
<ul class="PaginationLinks pagination-sm"></ul>
Add this script in to your JavaScript section
$('.PaginationLinks').twbsPagination(
{
    totalPages: 20,
    visiblePages: 7,
    onPageClick: function (event, PageNo) {
        $('.PageContent').text('Page ' + PageNo);
    }
});
Final code and demo is here

Demo

4 comments:

  1. Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a Front end developer learn from Javascript Training in Chennai . or Javascript Training in Chennai. Nowadays JavaScript has tons of job opportunities on various vertical industry. ES6 Training in Chennai

    ReplyDelete
  2. This article was written by a real thinking writer without a doubt. I agree many of the with the solid points made by the writer. I’ll be back day in and day for further new updates. buttons bootstrap

    ReplyDelete