jsp自定义标签实现分页

1. maven导入标签架包

 <!-- 自定义标签  -->
        <dependency>  
			<groupId>javax.servlet.jsp</groupId>  
			<artifactId>jsp-api</artifactId>  
			<version>2.2</version>  
        </dependency> 
        
        <dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>javax.servlet-api</artifactId>
			<version>3.1.0</version>
		</dependency>

2. 新建分页标签wld.tld文件

 

<?xml version="1.0" encoding="UTF-8"?>
<taglib>
    <tlib-version>1.0</tlib-version>
    <jsp-version>1.1</jsp-version>
    <short-name>wld</short-name>
    <uri>http://www.xxx.tld</uri>

	 <!-- 分页 -->
   <tag>
     <name>page</name>
      <tagclass>welab.finance.web.common.tags.GosPage</tagclass>
      <body-content>JSP</body-content>
 	  <attribute>
            <name>page</name>
            <required>true</required>
            <rtexprvalue>true</rtexprvalue>
      </attribute>
      <attribute>
            <name>action</name>
            <required>true</required>
            <rtexprvalue>true</rtexprvalue>
      </attribute>
   
  </tag>
  
  <tag>
     <name>param</name>
      <tagclass>welab.finance.web.common.tags.GosParam</tagclass>
      <body-content>JSP</body-content>
 	  <attribute>
            <name>name</name>
            <required>true</required>
            <rtexprvalue>true</rtexprvalue>
      </attribute>
      <attribute>
            <name>value</name>
            <required>true</required>
            <rtexprvalue>true</rtexprvalue>
      </attribute>
  </tag>
  
  
</taglib>

3. web.xml中配置

 <!--   自定义标签   -->
    <jsp-config>
		<taglib>
		<taglib-uri>http://www.xxx.tld</taglib-uri>
		<taglib-location>/WEB-INF/tld/wld.tld</taglib-location>
		</taglib>
   </jsp-config> 

4. 分页bean

 

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.lang.StringUtils;

/**
 * 分页对象类
 * 
 * @author rhj
 */
public class Page<E>  {

	/** 当前页数* */
	private int pageNum;

	/** 每页显示的记录数* */
	private int numPerPage;

	/** 记录行数* */
	private int rowsCount;

	/** 总页数* */
	private int pageCount;
	
	/** 分页列表数据*/
	private E list;
	
	/**分页开始**/
	private int startIndex;
	
	/**分页结束**/
	private int endIndex;


	/*** action中可以自己定义每页大小，然后获取页面的下一页的页数 **/
	public static  <E>Page<E> getPage(HttpServletRequest request, int numPerPage) {
		Page<E> page = new Page<E>();
		page.setNumPerPage(numPerPage);
		toPage(page, request);
		return page;
	}

	/** 获取页面的下一页的页数 **/
	public static  <E>Page<E> getPage(HttpServletRequest request) {
		Page<E> page = new Page<E>();
		toPage(page, request);
		return page;
	}

	/*** 获取页面的下一页的页数,并赋值当前页面页数 **/
	private static void toPage(Page page, HttpServletRequest request) {
		String pageNumber = request.getParameter("pageNum");
		if (!StringUtils.isEmpty(pageNumber)) {
			page.setPageNum(Integer.parseInt(pageNumber));
			int endIndex = page.getPageNum()*page.getNumPerPage();
			page.setEndIndex(endIndex);
			page.setStartIndex(endIndex-page.getNumPerPage());
		}
	}

	/*** 新建page时默认页面值 ****/
	private Page() {
		this.numPerPage = 10;
		this.pageNum = 1;
		this.startIndex = 0;
		this.endIndex =10;
	}


	public int getNumPerPage() {
		return numPerPage;
	}

	public void setNumPerPage(int numPerPage) {
		this.numPerPage = numPerPage;
	}

	public int getRowsCount() {
		return rowsCount;
	}

	public void setRowsCount(int rowsCount) {
		int pageSize = (int) Math.ceil((double) rowsCount / numPerPage);
		if(this.pageNum>pageSize && pageSize>=1){
			this.pageNum = pageSize;
		}
		this.rowsCount = rowsCount;
	}

	public int getPageCount() {
		return this.pageCount = (int) Math.ceil((double) rowsCount / numPerPage);
	}

	public E getList() {
		return list;
	}

	public void setList(E list) {
		this.list = list;
	}

	public int getStartIndex() {
		return (this.pageNum - 1) * this.numPerPage;
	}


	public int getPageNum() {
		return pageNum;
	}

	public void setPageNum(int pageNum) {
		this.pageNum = pageNum;
	}

	public int getEndIndex() {
		return endIndex;
	}

	public void setEndIndex(int endIndex) {
		this.endIndex = endIndex;
	}

	public void setPageCount(int pageCount) {
		this.pageCount = pageCount;
	}

	public void setStartIndex(int startIndex) {
		this.startIndex = startIndex;
	}


}

5. 创建分页标签处理类GosPage

package welab.finance.web.common.tags;

import java.io.IOException;

import javax.servlet.jsp.JspException;
import javax.servlet.jsp.tagext.BodyTagSupport;

import org.apache.log4j.Logger;

import welab.finance.web.common.Page;



/**
 * 分页标签
 * @author rhj
 *
 */

public class GosPage extends BodyTagSupport {
	private String action;
	private Page page;
	
	private Logger logger = Logger.getLogger(getClass());

	@Override
	public int doStartTag() throws JspException {
		return EVAL_BODY_BUFFERED;
	}

	@Override
	public int doEndTag() throws JspException {
		//标签体之间的内容
		String bodyContentVal = null;
		if (bodyContent != null) {
			bodyContentVal = bodyContent.getString();
		}
		//如果页数小于0
		if (page.getPageCount() <= 0) {
			page.setPageNum(0);
		}
		StringBuilder builder = new StringBuilder();
		builder.append("<form method=\"post\" name=\"pageForm\" id=\"pageForm\" action=\"").append(action).append("\">");
		builder.append("<div class='pageDiv'>");
		if (Integer.valueOf(page.getPageNum()) > 1) {
			builder.append("<a class=\"pageClass\" οnclick=\"toPage(").append(1).append(")\">").append("  首页  ").append("</a>");
			builder.append("<a class=\"pageClass\"  οnclick=\"toPage(").append(page.getPageNum()-1).append(")\">").append("  上一页  ").append("</a>");
		} else {
			builder.append("<a class=\"pageClassDisable\">").append("  首页  ").append("</a>");
			builder.append("<a class=\"pageClassDisable\">").append("  上一页  ").append("</a>");
		}
		if (Integer.valueOf(page.getPageNum()) < Integer.valueOf(page.getPageCount())) {
			builder.append("<a class=\"pageClass\" οnclick=\"toPage(").append(page.getPageNum()+1).append(")\">").append("  下一页  ").append("</a>");
			builder.append("<a class=\"pageClass\" οnclick=\"toPage(").append(page.getPageCount()).append(")\">").append("  尾页  ").append("</a>");
		} else {
			builder.append("<a class=\"pageClassDisable\">").append("  下一页  ").append("</a>");
			builder.append("<a class=\"pageClassDisable\">").append("  尾页  ").append("</a>");
		}
		builder.append("<span class=\"pageSpan\">共").append(page.getPageCount()).append("页/").append(page.getRowsCount()).append("条 </span>  ");
		builder.append("<span class=\"pageSpan\">第 <input type='text' id=\"pageNum\" name=\"pageNum\" ");
		if ("0".equals(page.getPageNum())) {builder.append("disabled=\"disabled\"");
		}
		builder.append(" id=\"currentPage\" class=\"pageInput\" maxlength=\"8\" value='");
		builder.append(page.getPageNum()).append("' οnkeyup=\"this.value=this.value.replace(/\\D/g,'')\" onafterpaste=\"this.value=this.value.replace(/\\D/g,'')\" /> 页");
		builder.append("</span>");
		builder.append(" <a οnclick=\"toPageGO(").append(page.getPageCount()).append(")");
		builder.append("\" class=\"pageGO\">GO</a>  ");
		builder.append("</div>");
		if (null != bodyContentVal && !"".equals(bodyContentVal)) {
			builder.append(bodyContentVal);
		}
		builder.append("</form>");
		
		
		
		//构造js函数
		builder.append("<script type=\"text/javascript\">");  
		builder.append("var pageForm = document.forms['pageForm'];");            
		builder.append("function toPage(pageNum) {");  
		builder.append("if(!isNaN(pageNum)){");
	    builder.append("pageNum=pageNum;");
	    builder.append("}else{pageNum=1;}");
		builder.append("pageForm.pageNum.value=").append("pageNum;");  
		builder.append("pageForm.submit();");  
		builder.append("}");  
		builder.append("function toPageGO(total) {");  
	    builder.append("var pageNum= document.getElementById('pageNum').value; " );
		builder.append("if(!isNaN(total)){");
	    builder.append("pageNum=pageNum > total ? total : pageNum;");
	    builder.append("pageNum=pageNum<=0 ? 1 :pageNum;" );
	    builder.append("}else{pageNum=1;}");
		builder.append("pageForm.pageNum.value=").append("pageNum;");  
		builder.append("pageForm.submit();");  
		builder.append("}");  
		
		builder.append("</script>"); 
		
		try {
			pageContext.getOut().print(builder.toString());
		} catch (IOException e) {
			e.printStackTrace();
			logger.error("分页标签错误",e);
		}
		return EVAL_PAGE;
	}

	public String getAction() {
		return action;
	}

	public void setAction(String action) {
		this.action = action;
	}

	public Page getPage() {
		return page;
	}

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


}

6. 创建标签分页参数类GosParam

import java.io.IOException;

import javax.servlet.jsp.JspException;
import javax.servlet.jsp.tagext.TagSupport;

import org.apache.log4j.Logger;
/**
 * 分页标签
 * @author rhj
 *
 * 2015年4月8日
 */
public class GosParam extends TagSupport{
	
	private Logger log=Logger.getLogger(getClass());
	
	private String name;
	private String value;
	
	@Override
	public int doStartTag() throws JspException {
		return SKIP_BODY;
	}
	/**
	 * form表单的隐形框 
	 */
	@Override
	public int doEndTag() throws JspException {
		StringBuilder builder = new StringBuilder();
		builder.append("<input type=\"hidden\"").append(" name=\"").append(name).append("\"");
		builder.append(" value=\"").append(value).append("\"/>");
		try {
			pageContext.getOut().print(builder.toString());
		} catch (IOException e) {
			e.printStackTrace();
			log.error("分页标签error",e);
		}
		return EVAL_PAGE;
	}
	
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getValue() {
		return value;
	}
	public void setValue(String value) {
		this.value = value;
	}

}

7. 分页样式类page.css

  

.pageDiv .pageClassDisable{text-decoration: none;cursor: pointer; margin-left: 10px;color: #B0B0B0}
.pageDiv .pageClass{text-decoration: none;cursor: pointer; margin-left: 10px;}
.pageDiv .pageGO{text-decoration: none;cursor: pointer; margin-left: 10px;}
.pagespan input{width: 35px;height: 20px;border: 1px solid #B0B0B0}
.pageDiv .pageSpan{margin-left:10px;}

8. jsp中引用分页

  1). 引入自定义标签    <%@ taglib uri="http://www.wolaidai.tld" prefix="wld"%>

  2). 引入css文件         <link href="../resources/page/page.css" rel="stylesheet">

  3). 显示分页

<!-- 分页 -->
	 <div>
		<div style="margin-top: 1.111111111%; text-align: center;">
			 <span>
              <wld:page action="/frs/writeoff/toApprovalWriteoff" page="${page}">
                     <wld:param name="application_id" value="${param.application_id}"/>
	             	 <wld:param name="mobile" value="${param.mobile}"/>
	             	 <wld:param name="userName" value="${param.userName}"/>
	             	 <wld:param name="applicantName" value="${param.applicantName}"/>
		       </wld:page> 
			</span> 
		</div>
	</div>

9.  java调用方法

         /**
	 * @param model
	 * @return
	 */
	@RequestMapping(value = "/toApprovalWriteoff")
	public String checkWriteoff(HttpServletRequest request,Model model,WriteoffTransactionVo writeoff,HttpSession session) {
		 
		 Integer userId = (Integer) session.getAttribute(FrsConstant.LOGIN_USER_ID);
		 writeoff.setApprovalId(userId);
		 Page<List<WriteoffTransactionVo>> page = Page.getPage(request);
		 int  rowsCount = writeoffTransferRetriever.getWriteoffTransactionsVosForApprovalCount(writeoff);	
		 page.setRowsCount(rowsCount);
		 List<WriteoffTransactionVo> writeoffList =
				 writeoffTransferRetriever.getWriteoffTransactionsVosForApproval(writeoff,page.getStartIndex(),page.getEndIndex());
		 model.addAttribute("writeoffList", writeoffList);
		 model.addAttribute("page", page);
		return "/writeoff/approval_writeoff";
	}

10. 分页效果展现

下班喽~~~~