'records per page' selectbox

[ssjogus]

hi,

thanks for this great plugin. what i want to do is have a select box with values like 5, 10, 15, 20 - for how many records to show in the table.

Can anyone suggest ways/hints to do that?

thanks for help in advance..

[opticyclic]

I came to the issues page to ask the very same question.

I have struggled to find another control with this feature so implementing it helps this project stand out!

[ssjogus]

hi,

I tried some jquery, and it is working now. please check at your end as well..

add a select box with proper option text and values (e.g. #select1)

I added the same function on document.ready as well as on change of selectbox. and it is pretty much working as expected. This function has been given on this site (http://www.bilalakil.me/simplepagination/comment-page-1/).

so the code is like this:

$('#select1').change(function(){
var selectValue = parseInt(document.getElementById("select1").value);

// Grab whatever we need to paginate
var pageParts = $(".paginate");

// How many parts do we have?
var numPages = pageParts.length;
// How many parts do we want per page?
var perPage = selectValue;
var start = 0;
var end = perPage;
pageParts.hide()
.slice(start, end).show();

// Apply simplePagination to our placeholder
$("#page-nav").pagination({
items: numPages,
itemsOnPage: perPage,
cssTheme: "light-theme",
// We implement the actual pagination
// in this next function. It runs on
// the event that a user changes page
onPageClick: function(pageNum) {
// Which page parts do we show?
var start = perPage * (pageNum - 1);
var end = start + perPage;
// First hide all page parts
// Then show those just for our page
pageParts.hide()
.slice(start, end).show();
}
});
});
});

[opticyclic]

I tried that in Plunker http://plnkr.co/edit/Bilj8O?p=preview but it didn't look right.
The select box isn't updating the data and it doesn't look themed right.

I'd rather it was implemented as part of the library itself.

[ssjogus]

hi,

here is a plunk with working pagination. The issue with adding it as a part of library is sometimes, we can not detach it from it. for e.g. I want to change the position of selectbox somewhere else, I can do easily this way when it is not a part of the library..

http://plnkr.co/edit/VCjIxJ?p=preview