pagination.js

function appendPaginationButton(pageInfo, actionUrl, pageSize, column, way) {
    var totalPage = pageInfo.totalPage;
    var allRow = pageInfo.allRow;
    var currentPage = pageInfo.currentPage;
    var offset = (currentPage - 1) * pageSize;
    var currentListSize = pageInfo.currentListSize;
    var buttonListLength = 8;
    var pagination = $("#pagination");
    pagination.empty();
    if (allRow < pageSize ) {
        pagination.append("<div id='page_info'>" + offset + "-" + allRow + " of " + allRow + "</div>");
    } else {
    pagination.append("<div id='page_info'>" + (offset +1) + "-" + (offset + currentListSize) + " of " + allRow + "</div>");
    }

    pagination.append("<div id='per_page_div'><select id='per_page'><option value='2'>2</option><option value='4'>4</option><option value='6'>6</option></select>");
    $("#per_page").change(function(){
    var size = $("#per_page").val();
    pageSize = size;
        getPageBean(actionUrl, 1, pageSize, column, way);
    });
    if (pageSize == "2") {
        $("#per_page option[value='2']").attr("selected", true);
    }
    if (pageSize == "4") {
        $("#per_page option[value='4']").attr("selected", true);
    }
    if (pageSize == "6") {
        $("#per_page option[value='6']").attr("selected", true);
    }
    pagination.append("<a href='#' id='first' name='1'></a>");
    pagination.append("<a href='#' id='forword' name='"+(currentPage - 1)+"'></a>");
    if (totalPage <= buttonListLength) {
        for (var k = 1; k <= totalPage; k++) {
            if ( k == currentPage) {
                pagination.append("<a href='#' class='current_page_a' name='"+k+"'>"+k+"</a>");
            } else {
                pagination.append("<a href='#' name='"+k+"'>"+k+"</a>");
            }
        }
    } else if (totalPage > buttonListLength && currentPage <= buttonListLength/2 ) {
         for (var k = 1; k <= buttonListLength; k++) {
            if ( k == currentPage) {
                pagination.append("<a href='#' class='current_page_a' name='"+k+"'>"+k+"</a>");
            } else {
                pagination.append("<a href='#' name='"+k+"'>"+k+"</a>");
            }
         }
    } else if (totalPage >= buttonListLength && currentPage > buttonListLength/2 && currentPage + buttonListLength/2 <=  totalPage) {
        for (var k = (currentPage - buttonListLength/2 + 1); k <= (currentPage +  buttonListLength/2); k++) {
            if ( k == currentPage) {
                pagination.append("<a href='#' class='current_page_a' name='"+k+"'>"+k+"</a>");
            } else {
                pagination.append("<a href='#' name='"+k+"'>"+k+"</a>");
            }
         }
    } else if (totalPage >= buttonListLength && (currentPage + buttonListLength/2 > totalPage) ) {
        for (var k = (totalPage - buttonListLength + 1); k <= totalPage; k++) {
            if ( k == currentPage) {
                pagination.append("<a href='#' class='current_page_a' name='"+k+"'>"+k+"</a>");
            } else {
                pagination.append("<a href='#' name='"+k+"'>"+k+"</a>");
            }
         }
    }

    if (currentPage + 1 > totalPage) {
        pagination.append("<a href='#' id='next' name='"+totalPage+"'></a>");
    } else {
        pagination.append("<a href='#' id='next' name='"+(currentPage + 1)+"'></a>");
    }
    pagination.append("<a href='#' id='last' name='"+(totalPage)+"'></a>");
    pagination.append("<div id='go_page'><input type='text' id='go_page_val' value='' maxlength='3' />&nbsp;&nbsp;<button class='go'></button</div>");
    $(".go").click(function(){
        var num = $("#go_page_val").val();
        if (isNaN(num)) {
            alert("please input a number");
            $("#go_page_val").val("");
            return false;
        } else {
            var allPage = parseInt(allRow / pageSize) + 1;
            if (num > allPage) {
                alert("not over " + allPage + "");
                $("#go_page_val").val("");
                return false;
            }
            getPageBean(actionUrl, num, pageSize, column, way);
        }
    });
    return false;
}