layui的分页怎么实现

如果你想了解更多关于layui的知识，可以点击：layui教程

这是是基于自己搭建的SSM案例框架来实现

效果图如下

分页jsp和js内容模块，暂时写在了一块，当然也可以提出来写个js文件

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



  
  
 
    
    
    
  


 

 

     
 
 搜索
 
 
 
 

后台实现 

主要的地方就是page、limit、count，其他的事情有layui分页插件来做(jsp页面有该代码)，只要page、limit、count这三个值，分页就能实现

//分页插件
    ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
    	layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
        ,groups: 1 //只显示 1 个连续页码
        ,first: false //不显示首页
        ,last: false //不显示尾页
        
      }

返回object类型，js会将这个类型当做json数据 

结合CSS3实现的jQuery分页插件

结合CSS3实现的jQuery分页插件,分页的效果是很常用的，无论是前台还是后端管理系统，都会使用到分页，在企业站或商城网站中都是很实用的。php中文网推荐下载！

下载

@SuppressWarnings("null")
	@RequestMapping(value = "userlist")
	@ResponseBody
	public Object userlist(HttpServletRequest request, HttpServletResponse response) {
		//分页
		String pageNo=request.getParameter("page");
		String pagesize=request.getParameter("limit");
		String uname=request.getParameter("selectValue");
		HashMap map=new HashMap();
		map.put("pageNo", (Integer.valueOf(pageNo)-1));
		map.put("pagesize", pagesize);
		//查询总数量
		List listsize = user.findAll();
		//分页传参page<当前页>和limit<显示数据条数>
		List list=null;
		try {
			list = user.selectAlllist((Integer.parseInt(pageNo)-1)*Integer.parseInt(pagesize),Integer.parseInt(pagesize));
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		System.out.println("条数："+list.size());
		Map result = new HashMap();
		int count = listsize.size();  
		JSONArray json = JSONArray.fromObject(list);  
		String js=json.toString();
        //*****转为layui需要的json格式，必须要这一步，博主也是没写这一步，在页面上数据就是数据接口异常  
        String jso = "{\"code\":0,\"msg\":\"\",\"count\":"+count+",\"data\":"+js+"}"; 
        System.out.println(jso); 
        return jso;
   
	}

对应的sql

select uid,uname,upass,sex,age,constellation,unative,national,labeltext from user where 1=1   limit #{pageNo},#{pagesize}

以及dao方法的传参

  public 	List selectAlllist(
    		@Param("pageNo") Integer pageNo
    		,@Param("pagesize") Integer pagesize);

daoimpl的实现

@Override
	public List selectAlllist(Integer pageNo, Integer pagesize) {
		// TODO Auto-generated method stub
		return user.selectAlllist(pageNo,pagesize);
	}

service的实现

public List selectAlllist(Integer pageNo, Integer pagesize);

serviceimpl的实现

@Override
	public List selectAlllist(Integer pageNo, Integer pagesize) {
		// TODO Auto-generated method stub
		return usi.selectAlllist(pageNo,pagesize);
	}