DWZ+jFinal结合写出的分页!

博主分享了自己在学习过程中,如何结合DWZ前端框架和jFinal后端框架完成分页功能的经历。通过JSP页面调用jFinal提供的分页功能,实现了后台管理的增删改操作。作为初学者,博主期待得到更多的指导和交流。

      新学习了jFinal做管理后台,前台学习DWZ实现对后台进行增删改操作,其他都还好,这个分页困扰了我好久,从昨天开始知道今天终于整出来了。

   开始   上图吧!


JSP页面:

<form id="pagerForm" method="post" action="<%=basePath%>admin/showAll">
	<input type="hidden" name="status" value="${param.status}">
	<input type="hidden" name="keywords" value="${param.keywords}" />
	<input type="hidden" name="pageNum" value="1" />					<!--【必须】value=1可以写死-->
	<input type="hidden" name="numPerPage" value="${param.numPerPage}" />	<!--【可选】每页显示多少条-->
	<input type="hidden" name="orderField" value="${param.orderField}" />  <!--【可选】查询排序-->
</form>

<div class="pageHeader">
	<form rel="pageForm" onsubmit="return navTabSearch(this);" action="<%=basePath%>admin/findByCondition" method="post">
	<div class="searchBar">
		<table class="searchContent">
			<tr>
				<td>
					我的客户:<input type="text" name="admin.account" />
				</td>
				<td>
					建档日期:<input type="text" class="date"/>
				</td>
			</tr>
		</table>
		<div class="subBar">
			<ul>
				<li><div class="buttonActive"><div class="buttonContent">
					<button type="submit">检索</button></div></div></li>
				<li>   </li>
			</ul>
		</div>
	</div>
	</form>
</div>
<div class="pageContent">
	<div class="panelBar">
		<ul class="toolBar">
			<li><a class="add" href="<%=basePath%>admin/add.jsp" target="dialog" mask="true" rel="customer _add" callback="prefresh"><span>添加</span></a></li>
			<li><a class="edit" id="toedit" href="<%=basePath%>admin/toedit/{id}" target="dialog"><span>修改</span></a></li>
			<li><a class="delete" id ="todel" href="#" fresh="true"><span>删除</span></a></li>
			<li class="line">line</li>
		</ul>
	</div>
	<table class="table" width="100%" layoutH="138">
		<thead>
			<tr>
				<th width="10"></th>
				<th width="120">ID</th>
				<th>账号名称</th>
			</tr>
		</thead>
		<tbody id="listtbody">
		  <c:forEach items="${blogPage.list}" var="a">
			<tr target="id" rel="${a.id}" id="del${a.id}" onclick="toGiveId(${a.id})">
				<td width="10"></td>
				<td width="100">${a.id}</td>
				<td width="120">${a.account}</td>
			</tr>
		 </c:forEach>
		</tbody>
	</table>
	<div class="panelBar">
		<div class="pages">
			<span>显示</span>
			<select class="combox" name="numPerPage" onchange="navTabPageBreak({numPerPage:this.value})">
				<option value="20">20</option>
				<option value="50">50</option>
				<option value="100">100</option>
				<option value="200">200</option>
			</select>
			<span>条,共${blogPage.totalRow}条</span>
		</div>
		<!--  targetType: navTab或dialog,用来标记是navTab上的分页还是dialog上的分页
                totalCount: 总条数  numPerPage: 每页显示多少条 pageNumShown: 页标数字多少个  currentPage: 当前是第几页 -->
		<div class="pagination" targetType="navTab" totalCount="${blogPage.totalRow}" numPerPage="${blogPage.pageSize}"
			 pageNumShown="10" currentPage="${blogPage.pageNumber}">
		</div>
	</div>
</div>
注意:这里重要的是下半部分:

<!--  targetType: navTab或dialog,用来标记是navTab上的分页还是dialog上的分页
                totalCount: 总条数  numPerPage: 每页显示多少条 pageNumShown: 页标数字多少个  currentPage: 当前是第几页 -->
		<div class="pagination" targetType="navTab" totalCount="${blogPage.totalRow}" numPerPage="${blogPage.pageSize}"
			 pageNumShown="10" currentPage="${blogPage.pageNumber}">
		</div>
jFinal的Controller部分:

public void showAll(){
		String a = getRequest().getParameter("pageNum");	//从前台获得当前是第几页
		if(a==null || a.equals(null)){
			a = "1";			//如果为空,默认是第一页
		}
		setAttr("blogPage", Admin.dao.paginate(Integer.parseInt(a), 10, "select *", "from admin order by id asc"));
		render("/admin/showAll.jsp");		//这是跳到前台页面
	}

这里调用的paginate() 方法是jFinal 自带的点开源代码,我们可以看到jFinal自带的Page<T>,里面有好多属性, 粘出一部分  如下:

   这里 jFinal本身已经给写好了,现在做的仅仅是调用而已。

/**
 * Page is the result of Model.paginate(......) or Db.paginate(......)
 */
public class Page<T> implements Serializable {
	
	private static final long serialVersionUID = -5395997221963176643L;
	
	private List<T> list;				// list result of this page
	private int pageNumber;				// page number
	private int pageSize;				// result amount of this page
	private int totalPage;				// total page
	private int totalRow;				// total row
	
	/**
	 * Constructor.
	 * @param list the list of paginate result
	 * @param pageNumber the page number
	 * @param pageSize the page size
	 * @param totalPage the total page of paginate
	 * @param totalRow the total row of paginate
	 */
	public Page(List<T> list, int pageNumber, int pageSize, int totalPage, int totalRow) {
		this.list = list;
		this.pageNumber = pageNumber;
		this.pageSize = pageSize;
		this.totalPage = totalPage;
		this.totalRow = totalRow;
	}
	
	/**
	 * Return list of this page.
	 */
	public List<T> getList() {
		return list;
	}
	
	/**
	 * Return page number.
	 */
	public int getPageNumber() {
		return pageNumber;
	}
	
	/**
	 * Return page size.
	 */
	public int getPageSize() {
		return pageSize;
	}
	
	/**
	 * Return total page.
	 */
	public int getTotalPage() {
		return totalPage;
	}
	
	/**
	 * Return total row.
	 */
	public int getTotalRow() {
		return totalRow;
	}

本人初学,懂得不多,初次发帖,望指教!


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值