DWZ (JUI) 教程 DWZ table 分页排序教程

一直很忙 demo一直没有写,最近忙着换工作空闲之余,写一下分页排序的 Demo 其实 也是比较简单的

顺便也录了一个小视频

JSP 页面

<%@ taglib uri="" prefix="c" %> <form id="pagerForm" method="post" action="user!searchUser.do"><input type="hidden" name="status" value="${param.status}"><input type="hidden" name="keywords" value="${param.keywords}" /><input type="hidden" name="pageNum" value="1" /><input type="hidden" name="numPerPage" value="${model.numPerPage}" /><input type="hidden" name="orderField" value="${param.orderField}" /><input type="hidden" name="orderDirection" value="${param.orderDirection}" /></form><div class="pageHeader"><form onsubmit="return navTabSearch(this);" action="user!searchUser.do" method="post"><div class="searchBar"></div></form></div><div class="pageContent"><div class="panelBar"><ul class="toolBar"><li class="line">line</li></ul></div><table class="table" width="100%" layoutH="90"><thead><tr><th width="80">序号</th><th width="120" orderField="name" <c:if test=’${param.orderField == "name" }’> class="${param.orderDirection}" </c:if> >名字</th><th width="120" orderField="realName" <c:if test=’${param.orderField == "realName" }’> class="${param.orderDirection}" </c:if> >真实姓名</th><th width="120" orderField="sex" <c:if test=’${param.orderField == "sex" }’> class="${param.orderDirection}" </c:if> >性别</th><th >phone</th></tr></thead><tbody> <c:forEach var="p" items="${pages.pages}" varStatus="status" ><tr target="sid" rel="${p.id}"><td>${status.count + (pages.pageNo-1)*pages.pageSize}</td><td>${p.name}</td><td>${p.realName}</td><td>${p.sex}</td><td>${p.phone}</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>条,,共${pages.count}条</span></div><div class="pagination" targetType="navTab" totalCount="${pages.count}" numPerPage="${pages.pageSize}" pageNumShown="10" currentPage="${pages.pageNo}"></div></div></div>

重点是

<input type="hidden" name="orderField" value="${param.orderField}" /><input type="hidden" name="orderDirection" value="${param.orderDirection}" />要和Action的属性对上<c:if test=’${param.orderField == "name" }’> class="${param.orderDirection}" </c:if> 用来切换 图标 点击时切换 排序类型

Action 层

package com.web.action;import javax.annotation.Resource;import org.springframework.context.annotation.Scope;import org.springframework.stereotype.Controller;import com.web.model.User;import com.web.service.UserService;/** * * @author Administrator * */@Controller()@Scope("prototype")public class UserAction extends BaseAction {private User user = new User();@Resourceprivate UserService userService;private String orderField;private String orderDirection;/*** 查询用户* @return*/public String searchUser(){pages = userService.searchUser(pages.getPageNo(), pages.getPageSize(), user, orderField ,orderDirection);return RESULT;}public User getUser() {return user;}public void setUser(User user) {this.user = user;}public UserService getUserService() {return userService;}public void setUserService(UserService userService) {this.userService = userService;}public String getOrderField() {return orderField;}public void setOrderField(String orderField) {this.orderField = orderField;}public String getOrderDirection() {return orderDirection;}public void setOrderDirection(String orderDirection) {this.orderDirection = orderDirection;}}重点是private String orderField;private String orderDirection;一般写到BaseAction中就行了真正的寂寞是在人群中,当你面对许多熟悉的脸,

DWZ (JUI) 教程 DWZ table 分页排序教程

相关文章:

你感兴趣的文章:

标签云: