layui真分页ssm框架 layui2

jsp:

<%@ page language="java" import="java.util.*"
	contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="root" value="${pageContext.request.contextPath}"></c:set>


<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>开启分页 - 数据表格</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="${root}/resource/layuiAdmin/src/layuiadmin/layui/css/layui.css" media="all">
  <script src="${root}/resource/js/jquery-1.11.0.min.js"></script>
	<script src="${root}/resource/layuiAdmin/src/layuiadmin/layui/layui.js"></script>
</head>
<script type="text/javascript">
        $(document).ready(function(){
              //ajax请求后台数据
              getShopCustomerManagePageInfo();


              //点击搜索时 搜索数据
              $("#selectButton").click(function(){ 
                getShopCustomerManagePageInfo();
                currentPageAllAppoint = 1; //当点击搜索的时候，应该回到第一页
                toPage();//然后进行分页的初始化

              })
           toPage();
        });

        //分页参数设置 这些全局变量关系到分页的功能
        var startAllAppoint = 0;
        var limitAllAppoint = 10;
        var currentPageAllAppoint = 1;
        var totalPageAllAppoint = 0;
        var dataLength = 0;
        //ajax请求后台数据
        function getShopCustomerManagePageInfo(){
            $.ajax({
                type:"post",
                async:false,
                url:"${root}/demo/layui_fys",
                data:{start:startAllAppoint, limit:limitAllAppoint,selectValue:$("#selectValue").val()},
                success:function(data,status){
                    /* data=eval("("+data+")"); */
                    getShopCustomesInfo(data.root);
                    startAllAppoint = data.currentResult;//当前页数(后台返回)
                    totalPageAllAppoint = data.totalPage;//总页数(后台返回)

                }
            });

        }



        function getShopCustomesInfo(data){
            var s = "<tr><th>人员编号</th><th>英文姓</th><th>英文名</th><th>证件编号</th></tr>";
            $.each(data,function(v,o){
                    s+='<tr><td>'+o.RYBH+'</td>';
                    s+='<td>'+o.YWX+'</td>';
                    s+='<td>'+o.YWM+'</td>';
                    s+='<td>'+o.ZJHM+'</td>';
            });

            if(data.length>0){
                $("#t_customerInfo").html(s);
            }else{
                $("#page1").hide();
                $("#t_customerInfo").html("<br/><span style='width:10%;height:30px;display:block;margin:0 auto;'>暂无数据</span>");
            }


        }



        function toPage(){

            layui.use(['form', 'laypage', 'layedit','layer', 'laydate'], function() {
                var form = layui.form,
                    layer = layui.layer,
                    layedit = layui.layedit,
                    laydate = layui.laydate,
                    laypage = layui.laypage;

                var nums = 10;
                //调用分页
                  laypage.render({
                    elem: 'paged'
                    ,count: totalPageAllAppoint //得到总页数，在layui2.X中使用count替代了，并且不是使用"总页数"，而是"总记录条数"
                    ,curr: currentPageAllAppoint
                    ,skip: true
                    ,jump: function(obj, first){

                        currentPageAllAppoint = obj.curr;
                        startAllAppoint = (obj.curr-1)*limitAllAppoint;
                      //document.getElementById('biuuu_city_list').innerHTML = render(obj, obj.curr);
                      if(!first){ //一定要加此判断，否则初始时会无限刷新
                      getShopCustomerManagePageInfo();//一定要把翻页的ajax请求放到这里，不然会请求两次。
                          //location.href = '?page='+obj.curr;
                        }
                    }
                  });


            });
        };

    </script>
</head>
<body>
    <div class="admin-main">


                <blockquote class="layui-elem-quote">
                <form class="layui-form" action="" >
                <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="text" id="selectValue" lay-verify="required" placeholder="客户姓名，电话" autocomplete="off" class="layui-input">
                </div>
                <button class="layui-btn" type="button" id="selectButton">搜索</button>
                </div>
                </form>
                <span><a href="shop_customer_manager_page_info">显示所有客户</a></span>
                </blockquote>
                <fieldset class="layui-elem-field">
                    <legend>客户列表</legend>
                    <div class="layui-field-box layui-form">
                        <table class="layui-table admin-table" id="t_customerInfo">

                        </table>
                    </div>
                </fieldset>
                <div class="admin-table-page">
                    <div id="paged" class="page">
                    </div>
                </div>
            </div>


</body>
</html>

java:

@RequestMapping(value="layui_fys")
	@ResponseBody
	public Map<String, Object> layui_fys(Integer start, Integer limit, String selectValue) throws Exception{
		System.out.println(start+"//"+limit+"//"+selectValue);
		Map<String, Object> map=new HashMap<String,Object>();
		Page page = new Page();
	    page.setStart(start);
	    page.setEnd(start+limit);
	    map.put("slz", selectValue);
		map.put("page", page);
		int total = demoService.getlayui_fysCount(map);
		List<Map<String,Object>> list;
		if(total>0){
			list = demoService.getlayui_fys(map);
			//System.out.println(list.get(0).get("ZJHM"));
			
		}else{
			list = new ArrayList<Map<String,Object>>();
		}
		 System.out.println(list);
         map.clear();
         map.put("currentResult", start);
         map.put("totalPage", total);
         map.put("root", list);
        //System.out.println("json:----" + jsonObject.toString());
        return map;
		
	}

sql:

 //以Oracle数据库为例
    <!-- layui计数 -->
    <select id="getlayui_fysCount" parameterType="java.util.Map" resultType="java.lang.Integer">

    	 select count(1) from crj_jwry_rcsp_ryjbxxb
    	 <if test='slz != null and slz != "" '>
			where  rybh = #{slz} or zjhm = #{slz} or ywx= #{slz} or ywm= #{slz}
		</if>
    	 
    </select>
    
	<!-- 数据列表layui -->
	<select id="getlayui_fys" parameterType="java.util.Map" resultType="java.util.Map">
   	select b.* from (
		select a.* ,rownum rn from (
    	 select * from crj_jwry_rcsp_ryjbxxb 
    	 <if test='slz != null and slz != "" '>
			 where rybh = #{slz} or zjhm = #{slz} or ywx= #{slz} or ywm= #{slz}
		 </if>
		 order by rybh
		) a where rownum &lt;= #{page.end}
	 ) b where  rn&gt;#{page.start}
    </select>

Page

public class Page {
		/**
		 * 当前页码
		 */
		private int page;
		/**
		 * 每页数量
		 */
		private int rows;
		
		/**
		 * oracle 开始数
		 */
		private int start;
		/**
		 * oracle 截止数
		 */
		private int end;

		public int getStart() {
			return start;
		}

		public void setStart(int start) {
			if (start < 0)
				start = 0;
			this.start = start;
		}

		public int getPage() {
			return page;
		}

		public void setPage(int page) {
			if(page <= 0){
				page = 1;
			}
			this.page = page;
		}

		public int getRows() {
			return rows;
		}

		public void setRows(int rows) {
			if (rows < 0)
				rows = 20;
			this.rows = rows;
		}

		public int getEnd() {
			return end;
		}

		public void setEnd(int end) {
			this.end = end;
		}

		public void init() {
			this.start = (this.page - 1) * this.rows;
			this.end = this.page * this.rows;
		}
	 }