user2818430 user2818430 - 2 months ago 44
jQuery Question

Bootstrap 3 table pagination (max pages)

I'm trying to figure out how I can change this plugin so that I can define the number o pages to show at once.

Bootstrap 3 table pagination plugin

I mean: if my table has 100 items/rows, and I want to show 10 items per page, that means I will have 10 pages totally in the pagination.

<< 1 2 3 4 5 6 7 8 9 10 >>


How can I change that plugin so I can see for example 5 pages at a time (instead of all 10)

<< 1 2 3 4 5 >>


and if you scroll to the 6'th page it will be:

<< 2 3 4 5 6 >>


and so forth ...

Answer

See this updated Bootply: http://bootply.com/93506

Add a new numbersPerPage setting. Then, hide/show the pager page number links (li) accordingly. Once when the plugin initializes..

if (settings.numbersPerPage>1) {
   $('.page_link').hide();
   $('.page_link').slice(pager.data("curr"), settings.numbersPerPage).show();
}

and once again in the goToPage() function when the page changes..

if (settings.numbersPerPage>1) {
    $('.page_link').hide();
    $('.page_link').slice(page, settings.numbersPerPage+page).show();
}

Here's another example making a Bootstrap reusable "pager" function. Then you just pass in the table and number of items per page..

$('#myTable').pageMe({pagerSelector:'#myPager',showPrevNext:true,hidePageNumbers:false,perPage:5});

http://www.codeply.com/go/bVuylrC5Oq

Comments