struts2+easyui分页排序

由于最近要用easyui+struts2做个后台，需要用到排序功能，而自己又是刚刚接触easyui，于是就去 网上各种搜索相关资料。找到的资料要么是不符合要求（用的不是struts2），要么就是不完整，总之看的那个悲催。。。对一个小白来说的真的很痛苦。。于是自己去查api和一些资料。最终终于是搞定了。其实很简单。做个笔记记录下来。

先看效果图吧。。(根据单价升序)

先看下前端：

$("#shopUserList").datagrid({
<span style="white-space:pre">			</span>url : '${pageContext.request.contextPath}/businessManage_findGoodsByShopId.action?shopRoleNumber='+shopId+'&&time='+new Date().getTime(),
<span style="white-space:pre">			</span>fitColumns : true,
<span style="white-space:pre">			</span>striped : true,
<span style="white-space:pre">			</span>fit:true,
<span style="white-space:pre">			</span>pagination : true,
<span style="white-space:pre">			</span>rownumbers:true,
<span style="white-space:pre">			</span>autoRowHeight:true,
<span style="white-space:pre">			</span>pageSize : 10,
<span style="white-space:pre">			</span>pageNumber : 1,
<span style="white-space:pre">			</span>pageList : [5,10,20,30,40],
<span style="white-space:pre">			</span>onSortColumn:function(sort,order){
<span style="white-space:pre">				</span>$.ajax({
<span style="white-space:pre">					</span>url : '${pageContext.request.contextPath}/businessManage_findGoodsByShopId.action?shopRoleNumber='+shopId+'&&sort='+sort+'&&order='+order+'&&time='+new Date().getTime(),
<span style="white-space:pre">					</span>success:function(){
<span style="white-space:pre">						</span>$("#shopUserList").datagrid("load");
<span style="white-space:pre">					</span>}
<span style="white-space:pre">				</span>});
<span style="white-space:pre">			</span>},columns : [[
<span style="white-space:pre">				</span></span>{field:"goodsId",align:'center',checkbox:true},
<span style="white-space:pre">				</span></span>{field:"goodsImg",title:'图片',align:'center',
<span style="white-space:pre">					</span></span>formatter:function(value,row){
<span style="white-space:pre">				</span></span>    <span style="white-space:pre">	</span></span>var str = "";
<span style="white-space:pre">				</span></span>    <span style="white-space:pre">	</span></span>if(value!="" || value!=null){
<span style="white-space:pre">				</span></span>    <span style="white-space:pre">		</span></span>str = "<img alt='未找到' οnmοuseοut='out(this)' οnmοuseοver='over(this)' style='margin:0px;height:50px;width:50px;border-radius:10px;z-index:1' src=${pageContext.request.contextPath}/goodsImg/"+value+">";
<span style="white-space:pre">				</span></span>           return str;
<span style="white-space:pre">				</span></span>    <span style="white-space:pre">	</span></span>}
<span style="white-space:pre">			</span></span>    <span style="white-space:pre">	</span></span>}
<span style="white-space:pre">			</span></span>    },
<span style="white-space:pre">				</span></span>{field:"goodsName",title:'商品名',align:'center'},
<span style="white-space:pre">				</span></span>{field:"goodsPrice",sortable:true,title:'单价',align:'center'},
<span style="white-space:pre">				</span></span>{field:"goodsKucun",sortable:true,title:'库存',align:'center'},
<span style="white-space:pre">				</span></span>{field:"goodsIsShangjia",sortable:true,title:'是否上架',align:'center',
<span style="white-space:pre">					</span></span>formatter: function(value,row,index){
<span style="white-space:pre">							</span></span>if(value == 1){
<span style="white-space:pre">								</span></span>return "<font style='font-weight:800;color:#21a1a1'>已上架</font>";
<span style="white-space:pre">							</span></span>}else{
<span style="white-space:pre">								</span></span>return "<font style='font-weight:800;color:red'>已下架</font>";
<span style="white-space:pre">							</span></span>}
<span style="white-space:pre">						</span></span>}
<span style="white-space:pre">				</span></span>},
<span style="white-space:pre">				</span></span>{field:"goodsIsDiancan",sortable:true,title:'支持点餐',align:'center',
<span style="white-space:pre">					</span></span>formatter: function(value,row,index){
<span style="white-space:pre">						</span></span>if(value == 1){
<span style="white-space:pre">							</span></span>return "<font style='font-weight:800;color:#21a1a1'>支持</font>";
<span style="white-space:pre">						</span></span>}else{
<span style="white-space:pre">							</span></span>return "<font style='font-weight:800;color:red'>不支持</font>";
<span style="white-space:pre">						</span></span>}
<span style="white-space:pre">					</span></span>}
<span style="white-space:pre">				</span></span>},
<span style="white-space:pre">				</span></span>{field:"goodsSales",sortable:true,title:'销量',align:'center'},
<span style="white-space:pre">				</span></span>{field:"goodsNumber",sortable:true,title:'商品分类类别',align:'center',
<span style="white-space:pre">					</span></span>formatter: function(value,row,index){
<span style="white-space:pre">					</span></span>  <c:forEach var="data" items="${sessionScope.goodsClassify }">
<span style="white-space:pre">					</span></span>  <span style="white-space:pre">	</span></span>if(value == ${data.goodsNumber}){
<span style="white-space:pre">					</span></span>  <span style="white-space:pre">		</span></span>return "${data.goodsName}";
<span style="white-space:pre">					</span></span>  <span style="white-space:pre">	</span></span>}
<span style="white-space:pre">					</span></span>  </c:forEach>
<span style="white-space:pre">					</span></span>}
<span style="white-space:pre">				</span></span>},
<span style="white-space:pre">				</span></span>{field:"state",sortable:true,title:'商品状态',align:'center',
<span style="white-space:pre">					</span></span>formatter: function(value,row,index){
<span style="white-space:pre">						</span></span>if(value == 1){
<span style="white-space:pre">							</span></span>return "<img width='20px' src='${pageContext.request.contextPath}/image/MsgSent.gif'/>";
<span style="white-space:pre">						</span></span>}else{
<span style="white-space:pre">							</span></span>return "<img width='20px' src='${pageContext.request.contextPath}/image/MsgError.gif'/>";
<span style="white-space:pre">						</span></span>}
<span style="white-space:pre">					</span></span>}
<span style="white-space:pre">				</span></span>}
<span style="white-space:pre">			</span></span>]]<pre name="code" class="html"><span style="white-space:pre">		</span></span>})
<span style="white-space:pre">			</span></span>

1.给需要排序的字段添加 sortable:true属性
2.$("#dg").datagrid({
onSortColumn:function(sort,order){
$.ajax({
url : '${pageContext.request.contextPath}/businessManage_findGoodsByShopId.action? shopRoleNumber='+shopId+'&&sort='+sort+'&&order='+order+'&&time='+new Date().getTime(),
success:function(){
$("#shopUserList").datagrid("load");
}
});

},

})

onSortColumn的两个属性sort为点击的字段名（name:），order为排序顺序（desc和sac）;

3.ajax把sort和order提交到action

4.最后别忘了，ajax提交处理success记得要load一下

分页和排序写在一起

private List<Goods> rows;
	private int total;
	private int page;
	private String sort;
	private String order;
	public void setSort(String sort) {
		this.sort = sort;
	}
	public void setOrder(String order) {
		this.order = order;
	}
	public void setList(List<Goods> rows) {
		this.rows = rows;
	}
	public void setPage(int page) {
		this.page = page;
	}
	public List<Goods> getRows() {
		return rows;
	}
	public int getTotal() {
		return total;
	}
	public String findGoodsByShopId(){
		if(sort == null){
			sort = "goodsId";
		}
		if(order == null){
			order = "DESC";
		}
		int row = Integer.parseInt(ServletActionContext.getRequest()
				.getParameter("rows"));
		int shopRoleNumber = Integer.parseInt(ServletActionContext.getRequest()
				.getParameter("shopRoleNumber"));
		try {
			PageBean<Goods> pageData = new PageBean<>(row);
			pageData.setCurrentPage(page);
			goodsService.GoodsByShopNum(pageData,shopRoleNumber,sort,order);
			total = pageData.getTotalCount();
			rows = pageData.getPageData();
			return "backJson";
		} catch (Exception e) {
			e.printStackTrace();
			return "error";
		}
		
	}

Dao层的排序、分页的sql：

String sql = "select * from goods where shopNumber=? ORDER BY "+sortName+" "+sortOrder+"   limit ?,?";