myPagination 分页插件(ajax) + springmvc + springdata

最新推荐文章于 2017-06-08 14:43:22 发布

michnus

最新推荐文章于 2017-06-08 14:43:22 发布

阅读量3.6k

点赞数

分类专栏：学习点滴文章标签： ajax string function stylesheet callback query

本文链接：https://blog.csdn.net/michnus/article/details/7962337

版权

学习点滴专栏收录该内容

4 篇文章 0 订阅

订阅专栏

前台

<link href="${ctx}/static/myPagination/css/page.css" rel="stylesheet" type="text/css" />
<script src="${ctx}/static/myPagination/js/jquery.myPagination.js" type="text/javascript"></script>
<script>
$(function() {
    $("#pagediv").myPagination({
      currPage: 1,
      pageCount: 10,
      pageSize: 7,
      ajax: {
              on: true,                         //开启状态
              callback: 'ajaxCallBack',         //回调函数，注，此 ajaxCallBack 函数，必须定义在 $(function() {}); 外面
              url: '${ctx}' + "/admin/bobing/rolls/list",            //访问服务器地址
              dataType: 'json',                 //返回类型
              param:{on:true,page:1,pageSize:10,acode:'',uname:''} //参数列表，其中  on 必须开启，page 参数必须存在，其他的都是自定义参数，如果是多条件查询，可以序列化表单，然后增加 page 参数
            }
    });
  });

function search(){
 $("#pagediv").myPagination({
      currPage: 1,
      pageCount: 10,
      pageSize: 7,
      ajax: {
              on: true,                         
              callback: 'ajaxCallBack',         
              url: '${ctx}' + "/admin/bobing/rolls/list",            
              dataType: 'json',                 
              param:{on:true,page:1,pageSize:10,acode:document.getElementsByName('area')[0].value,uname:document.getElementsByName('uname')[0].value} 
            }
    });
}

//自定义 回调函数
function ajaxCallBack(data) {
         var result = data.result ;
         var insetViewData = ""; //视图数据
         $.each(result, function(index,items) {
         //alert(items.id);
         insetViewData += createTR(items);
         });
         $("table > tbody").html(insetViewData);
}

function createTR(obj){
 var tr = "<tr>";
 tr += "<td>"+obj.rollTimes.user.name+"</td>";
 tr += "<td>"+obj.rollTimes.area.aname+"</td>";
 tr += "<td>"+obj.rollCode+"</td>";
 tr += "<td>"+obj.rollText+"</td>";
 tr += "<td>"+obj.rollTime+"</td>";
 tr += "<td>"+obj.score+"</td>";
 tr += "</tr>";
 return tr;
}
</script>

<body>
<table width="100%" border="1">
<thead>
<tr><td width="10%"><input type="text" name="uname"/></td><td width="10%"><input type="text" name="area" value="xm"/></td><td width="20%"><input type="button" value="查询" οnclick="search()"/></td><td width="20%"></td><td width="20%"></td><td width="20%"></td></tr>
<tr><td>用户</td><td>区域</td><td>结果</td><td>结果描述</td><td>时间</td><td>得分</td></tr>
</thead>
<tbody>

</tbody>
</table>
<div id="pagediv"></div>
</body>

后台

控制器：

@RequestMapping(value = { "/rolls/index", "/rolls" }, method = RequestMethod.GET)
 public String rollsIndex() {
  return "admin/rollsList";
 }

 @RequestMapping(value = "/rolls/list")
 @ResponseBody
 public String rollsList(@RequestParam("page") int page,
   @RequestParam("pageSize") int pageSize,
   @RequestParam("acode") String acode,
   @RequestParam("uname") String uname) {

  // Page<Rolls> p = rollsManager.getAllRolls(page, pageSize);

  Page<Rolls> p = rollsManager.getRolls(page, pageSize,acode,uname);
  Map<String, Object> map = Maps.newLinkedHashMap();

  map.put("result", p.getContent());
  map.put("pageCount", p.getTotalPages());

  return jsonMapper.toJson(map);
 }

service:

/**
  * 根据区域代码、用户名 查看博饼记录
  * 
  * @param pageIndex
  * @param pageSize
  * @param acode
  * @param userName
  * @return
  */
 public org.springframework.data.domain.Page<Rolls> getRolls(int pageIndex,
   int pageSize, String acode, String userName) {

  PageRequest pageRequest = new PageRequest(pageIndex - 1, pageSize,
    new Sort(Direction.DESC, "rollTime"));

  if (StringUtils.isEmpty(acode) && StringUtils.isEmpty(userName))
   return getRolls(pageRequest);

  if (StringUtils.isNotEmpty(acode) && StringUtils.isNotEmpty(userName))
   return getRollsByAreaAcodeUserName(acode,userName,pageRequest);

  if (StringUtils.isNotEmpty(acode))
   return getRollsByAcode(acode, pageRequest);

  return getRollsByUserName(userName, pageRequest);

 }

dao:

public interface RollsDao extends PagingAndSortingRepository<Rolls,Long>,RollsDaoCustom {

	
	
	@Query("select r from Rolls r where r.area.acode = ?1 ")
	public Page<Rolls> findByAreaAcode(String acode,Pageable pageable);
	
	
	@Query("select r from Rolls r where r.user.name = ?1 ")
	public Page<Rolls> findByUserName(String name,Pageable pageable);
	
	@Query("select r from Rolls r where r.area.acode = ?1 and r.user.name = ?2 ")
	public Page<Rolls> findByAreaAcodeAndUserName(String acode,String name,Pageable pageable);
	
	@Query("select r from Rolls r where r.rollTimes.id = ?1 ")
	public Page<Rolls> findByUserRollTimesId(Long id,Pageable pageable);
	
}

官网：http://code.google.com/p/mypagination/

中文参数乱码解决：修改jquery.myPagination.js中

$.ajax({url:varUrl,type:'POST',data:param,contentType:"application/x-www-form-urlencoded;charset=UTF-8" ....

type:'POST' contentType:"...charset=UTF-8"

michnus

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
myPagination 分页插件(ajax) + springmvc + springdata

前台$(function() { $("#pagediv").myPagination({ currPage: 1, pageCount: 10, pageSize: 7, ajax: { on: true, //开启状态
复制链接

扫一扫

专栏目录