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

转载自: http://blog.csdn.net/jiweigang1/article/details/7771597

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

顺便也录了一个小视频http://115.com/file/c2ik04qy

http://v.youku.com/v_show/id_XNDMxMDMzOTg4.html

 

JSP 页面

 

 

<%@tagliburi="http://java.sun.com/jsp/jstl/core"prefix="c"%>
<formid="pagerForm"method="post"action="user!searchUser.do">
<inputtype="hidden"name="status"value="${param.status}">
<inputtype="hidden"name="keywords"value="${param.keywords}"/>
<inputtype="hidden"name="pageNum"value="1"/>
<inputtype="hidden"name="numPerPage"value="${model.numPerPage}"/>

<inputtype="hidden"name="orderField"value="${param.orderField}"/>
<inputtype="hidden"name="orderDirection"value="${param.orderDirection}"/>
</form>


<divclass="pageHeader">
<formonsubmit="returnnavTabSearch(this);"action="user!searchUser.do"method="post">
<divclass="searchBar">
</div>
</form>
</div>
<divclass="pageContent">
<divclass="panelBar">
<ulclass="toolBar">
<liclass="line">line</li>
</ul>
</div>
<tableclass="table"width="100%"layoutH="90">
<thead>
<tr>
<thwidth="80">序号</th>
<thwidth="120"orderField="name"<c:iftest='${param.orderField=="name"}'>class="${param.orderDirection}"</c:if>>名字</th>
<thwidth="120"orderField="realName"<c:iftest='${param.orderField=="realName"}'>class="${param.orderDirection}"</c:if>>真实姓名</th>
<thwidth="120"orderField="sex"<c:iftest='${param.orderField=="sex"}'>class="${param.orderDirection}"</c:if>>性别</th>
<th>phone</th>
</tr>
</thead>
<tbody>
<c:forEachvar="p"items="${pages.pages}"varStatus="status">
<trtarget="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>
<divclass="panelBar">
<divclass="pages">
<span>显示</span>
<selectclass="combox"name="numPerPage"onchange="navTabPageBreak({numPerPage:this.value})">
<optionvalue="20">20</option>
<optionvalue="50">50</option>
<optionvalue="100">100</option>
<optionvalue="200">200</option>
</select>
<span>条，共${pages.count}条</span>
</div>

<divclass="pagination"targetType="navTab"totalCount="${pages.count}"numPerPage="${pages.pageSize}"pageNumShown="10"currentPage="${pages.pageNo}"></div>

</div>
</div>

 

重点是

 

<inputtype="hidden"name="orderField"value="${param.orderField}"/>
<inputtype="hidden"name="orderDirection"value="${param.orderDirection}"/>

要和Action的属性对上

<c:iftest='${param.orderField=="name"}'>class="${param.orderDirection}"</c:if>
用来切换图标点击时切换排序类型

 

Action 层

 

packagecom.web.action;

importjavax.annotation.Resource;
importorg.springframework.context.annotation.Scope;
importorg.springframework.stereotype.Controller;

importcom.web.model.User;
importcom.web.service.UserService;

/**
*
*@authorAdministrator
*
*/
@Controller()
@Scope("prototype")
publicclassUserActionextendsBaseAction{


privateUseruser=newUser();
@Resource
privateUserServiceuserService;
privateStringorderField;
privateStringorderDirection;

/**
*查询用户
*@return
*/
publicStringsearchUser(){
pages=userService.searchUser(pages.getPageNo(),pages.getPageSize(),user,orderField,orderDirection);
returnRESULT;
}




publicUsergetUser(){
returnuser;
}

publicvoidsetUser(Useruser){
this.user=user;
}

publicUserServicegetUserService(){
returnuserService;
}

publicvoidsetUserService(UserServiceuserService){
this.userService=userService;
}




publicStringgetOrderField(){
returnorderField;
}




publicvoidsetOrderField(StringorderField){
this.orderField=orderField;
}




publicStringgetOrderDirection(){
returnorderDirection;
}




publicvoidsetOrderDirection(StringorderDirection){
this.orderDirection=orderDirection;
}

}

重点是

 

 

privateStringorderField;
privateStringorderDirection;

一般写到BaseAction中就行了

 

 

Service层

 

packagecom.web.service.impl;

importcom.dwz.util.Pages;
importorg.springframework.stereotype.Service;
importjavax.annotation.Resource;
importcom.web.model.User;
importcom.web.dao.UserDao;
importcom.web.service.UserService;


@Service("userService")
publicclassUserServiceImplimplementsUserService{

@Resource
privateUserDaouserDao;


@Override
publicUsergetUser(intid){
returnuserDao.get(id);
}

@Override
publicvoidaddUser(Useruser){
userDao.insert(user);
}

@Override
publicvoidupdateUser(Useruser){
userDao.update(user);
}

@Override
publicvoiddeleteUser(intid){
userDao.delete(id);
}

@Override
publicvoidreportUser(Useruser){
userDao.insertOrUpdate(user,user.getId());
}

@Override
publicPagessearchUser(intpageNo,intpageSize,Useruser,StringorderField,StringorderDirection){
Stringwhere="where1=1";
if(orderField!=null&&!orderField.trim().equals("")){
if(orderDirection==null||orderDirection.trim().equals("")){
orderDirection="asc";
}

where+="orderby"+orderField+""+orderDirection;
}
returnuserDao.listInPages(pageNo,pageSize,where);
}


}

其是比较简单 希望对大家有帮助

 

 

效果图