GibboK
GibboK

Reputation: 73998

Pagination in JS

I would need tweak this Pagination in JS

As you can see from this sample

http://jsfiddle.net/jfm9y/

pageSize = 3;
resultN = null;

showPage = function(page) {
    $(".content").hide();
    $(".content").each(function(n) {
        if (n >= pageSize * (page - 1) && n < pageSize * page)
            $(this).show();
    });        
}

showPage(1);

$("#pagin li a").click(function() {
    $("#pagin li a").removeClass("current");
    $(this).addClass("current");
    showPage(parseInt($(this).text()))


});

On Page 1 a User can see div / 1 / 2 / 3 /

When a User click Page 2 the script show / 4 / 5 / 6 /

I would need change this script so when a User click Page 2 he would see / 2 / 3 / 4 /

and when clicking Page 3 he would see / 3 / 4 / 5 / and so on.

Could you point me out in the right direction?

EDIT - revised version (thanks to Kolink & dencey)

http://jsfiddle.net/jfm9y/89/


    var pageSize = 3;

var showPage = function(page) {
    $(".content").hide();
    $(".content").each(function(n) {
        if (n >= (page - 1) && n < (page - 1) + pageSize)
            $(this).show();
    });        
}

showPage(1);

$("#pagin li a").click(function() {
    $("#pagin li a").removeClass("current");
    $(this).addClass("current");
    showPage(parseInt($(this).text())) 
});

Upvotes: 0

Views: 511

Answers (2)

dencey
dencey

Reputation: 1061

Try this sample http://jsfiddle.net/jfm9y/89/

var showPage = function(page) {
    $(".content").hide();
    $(".content").each(function(n) {
        if (n >= (page - 1) && n < (page - 1) + pageSize)
            $(this).show();
    });        
}

Upvotes: 1

Niet the Dark Absol
Niet the Dark Absol

Reputation: 324820

Change your if to if(n>=page && n<page+pageSize)

In this way, you have:

Page 1 => Divs 1, 2, 3
Page 2 => Divs 2, 3, 4
And so on.

Upvotes: 4

Related Questions