BootStrop--bootstrap-paginator.js 分页 插件 的使用

版权声明:帅气Dee海绵宝宝 https://blog.csdn.net/xyjcfucdi128/article/details/83615793

样式图

引入资源

<script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery.min.js"></script>
<link type="text/css" rel="stylesheet"  href="<%=request.getContextPath() %>/css/page.css"/>
<script type="text/javascript" src="<%=request.getContextPath() %>/js/bootstrap-paginator1.js"></script>

div样式

<input type="hidden" id="pageNum1" value="${myData.newPage}"/>
<input type="hidden" id="pages1" value="${myData.allPage}"/>
<input type="hidden" id="total1" value="${myData.total}"/>
<div align="center">
	<div id="nav_list" style="height:30px;"></div> 
</div>

script

<script type="text/javascript">

var pageNum = $("#pageNum1").val();//当前页
var pages = $("#pages1").val();//总页数
var total = $("#total1").val();//一页显示的行数
//通用算法,分页导航栏
    $('#nav_list').bootstrapPaginator({
        currentPage: pageNum,
        totalPages: pages,
        numberOfPages:total,
        itemTexts: function (type, page, current) {
            switch (type) {
                case "first": return "首页";
                case "prev": return "上一页";
                case "next": return "下一页";
                case "last": return "尾页";
                case "page": return page;
            }
        },
        onPageClicked: function (event, originalEvent, type, page) {
        	var url = "../pcc/MDAR?page="+page;
        
            location.href=url;
        }
    });

</script>

分页实体

package com.bw.data.portal.entity;

import java.util.List;

/**
 * 分页实体类
 * */
@SuppressWarnings("rawtypes")
public class Page {
	private List rows;
	private long total;//条数 我sericeImpl 固定给死的 10 条
	private Long allPage;//总页数
	private Integer newPage;//当前页
	
	public Page(){}
	
	public Page(List rows, long total) {
		super();
		this.rows = rows;
		this.total = total;
	}

	public Long getAllPage() {
		return allPage;
	}

	public void setAllPage(Long allPage) {
		this.allPage = allPage;
	}

	public Integer getNewPage() {
		return newPage;
	}

	public void setNewPage(Integer newPage) {
		this.newPage = newPage;
	}

	public List getRows() {
		return rows;
	}
	public void setRows(List rows) {
		this.rows = rows;
	}
	public long getTotal() {
		return total;
	}
	public void setTotal(long total) {
		this.total = total;
	}

	@Override
	public String toString() {
		return "Page [rows=" + rows + ", total=" + total + "]";
	}
}

查询基础类 可用于实体类继承

/**
 * 实体
 */
public class QueryPersonCenterInfo extends QueryBase{
	
	private String id;
	private String articleId;
	private String tableId;

}
package com.bw.data.portal.entity;

/*
* 类描述:查询基础类
* @auther wangmx
*/
public class QueryBase {

    /** 要排序的字段名 */
    protected String sort;
    /** 排序方式: desc \ asc */
    protected String order = "";
    /** 获取一页行数 */
    protected int limit;
    /** 获取的页码 */
    protected int page;
    /** 起始记录 */
    protected int offset;

    public String getSort() {
        return sort;
    }

    public void setSort(String sort) {
        if(sort==null){
            return ;
        }
        String orderSort = "";
        for( int i = 0 ; i<sort.length(); i++ ){
            char a = sort.charAt(i);
            String b = ""+a;
            if( a>64 && a<91 ){ //大写字母的ASCLL码取值范围
                if(orderSort.equals("")){
                    orderSort = orderSort + b.toLowerCase();
                }else{
                    orderSort = orderSort + "_" + b.toLowerCase();
                }
            }else{
                orderSort = orderSort + b;
            }
        }
        this.sort = orderSort;
    }


    public String getOrder() {
        return order;
    }

    public void setOrder(String order) {
        this.order = order;
    }

    public int getLimit() {
        return limit;
    }

    public void setLimit(int limit) {
        this.limit = limit;
    }

    public int getPage() {
        return page;
    }

    public void setPage(int page) {
        this.page = page;
    }

    public int getOffset() {
        return (this.page-1)*limit;
    }

    public void setOffset(int offset) {
        this.offset = offset;
    }
}

分页资源下载路径js css

csdn下载地址:https://download.csdn.net/download/xyjcfucdi128/10757125

githup下载地址:https://github.com/2224132867/bootStrop-bootstrap-paginator.js

猜你喜欢

转载自blog.csdn.net/xyjcfucdi128/article/details/83615793