今天基于layui实现了将查询出的数据进行分页显示,具体效果图:
话不多说,直接上代码:
jsp文件:
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Layui</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, maximum-scale=1">
<link rel="stylesheet" href="lib/layui/css/layui.css" media="all">
<!-- 注意:如果你直接复制所有代码到本地,上述css路径需要改成你本地的 -->
</head>
<body>
<table class="layui-hide" id="test"></table>
<script src="lib/layui/layui.js" charset="utf-8"></script>
<!-- 注意:如果你直接复制所有代码到本地,上述js路径需要改成你本地的 -->
<script>
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#test'
,method:"post"
,cache:false
,url:'CourseServlet?method=fenye'
//数据总数,从服务端得到 发送数据用where
//示例:,where{"a":b}
,cols: [[
{field:'id', 80, title: 'ID', sort: true}
,{field:'username', 80, title: '用户名'}
,{field:'sex', 80, title: '性别', sort: true}
,{field:'city', 80, title: '城市'}
,{field:'sign', title: '签名', minWidth: 150}
,{field:'experience', 80, title: '积分', sort: true}
,{field:'score', 80, title: '评分', sort: true}
,{field:'classify', 80, title: '职业'}
,{field:'wealth', 135, title: '财富', sort: true}
]]
,page: true
});
});
</script>
</body>
</html>
servlet.java:()
package com.hjf.servlet; import java.io.IOException; import java.util.List; import java.util.Map; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import com.google.gson.Gson; import com.hjf.dao.CourseDao; import com.hjf.entity.Course; import com.hjf.entity.Course1; import com.hjf.entity.Users; import com.hjf.entity.fenye; import com.hjf.service.CourseService; @WebServlet("/CourseServlet")
public class CourseServlet extends HttpServlet { private static final long serialVersionUID = 1L; CourseService service = new CourseService(); CourseDao cDao = new CourseDao();
protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { req.setCharacterEncoding("utf-8"); String method = req.getParameter("method"); if ("xxx".equals(method)) { xxx(req, resp); } else if ("fenye".equals(method)) { fenye(req,resp); } }
protected void fenye(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { req.setCharacterEncoding("utf-8"); resp.setContentType("text/html;charset=utf-8"); String page =req.getParameter("page"); String limit =req.getParameter("limit"); // System.out.println(a+b); Users r = new Users(); r.setCode(0); r.setMsg("获得数据成功"); //所有的数据数目,并不是单单一页展示的数目 r.setCount(cDao.searchcount()); //加载处理 可有可无,并不影响 CourseDao cDao = new CourseDao(); List<fenye> list = cDao.chartLook1(page, limit); //传递的数据集 r.setData(list); Gson gson = new Gson(); String json = gson.toJson(r); System.out.println(json); resp.getWriter().write(json); }
}
实体类:
Users.java:
package com.hjf.entity; public class Users { /**响应编码*/ private int code; /**响应消息*/ private String msg; /**数据总量*/ private int count; /**数据*/ private Object data; public Users() { } public Users(int code, String msg, int count, Object data) { super(); this.code = code; this.msg = msg; this.count = count; this.data = data; } @Override public String toString() { return "R [code=" + code + ", msg=" + msg + ", count=" + count + ", data=" + data + "]"; } public int getCode() { return code; } public void setCode(int code) { this.code = code; } public String getMsg() { return msg; } public void setMsg(String msg) { this.msg = msg; } public int getCount() { return count; } public void setCount(int count) { this.count = count; } public Object getData() { return data; } public void setData(Object data) { this.data = data; } }
fenye.java:
package com.hjf.entity;
public class fenye {
private int id;
private String username;
private String sex;
private String city;
private String sign;
private String experience;
private String score;
private String classify;
private String wealth;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
public String getCity() {
return city;
}
public void setCity(String city) {
this.city = city;
}
public String getSign() {
return sign;
}
public void setSign(String sign) {
this.sign = sign;
}
public String getExperience() {
return experience;
}
public void setExperience(String experience) {
this.experience = experience;
}
public String getScore() {
return score;
}
public void setScore(String score) {
this.score = score;
}
public String getClassify() {
return classify;
}
public void setClassify(String classify) {
this.classify = classify;
}
public String getWealth() {
return wealth;
}
public void setWealth(String wealth) {
this.wealth = wealth;
}
public fenye(int id,String username,String sex,String city,String sign,String experience,String score,String classify,String wealth) {
this.id = id;
this.username = username;
this.sex = sex;
this.city = city;
this.sign = sign;
this.experience = experience;
this.score = score;
this.classify = classify;
this.wealth = wealth;
}
}
CourseDao.java
package com.hjf.dao;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import com.hjf.entity.Course;
import com.hjf.entity.Course1;
import com.hjf.entity.Users;
import com.hjf.entity.fenye;
import com.hjf.util.DBUtil;
/**
* 课程Dao
* Dao层操作数据
* @author Hu
*
*/
public class CourseDao {
CourseDao dao;
public List<fenye> chartLook1(String page,String limit){
String sql="select * from fenye";
Connection connection= DBUtil.getConn();
Statement statement=null;
ResultSet resultSet=null;
int Page = Integer.parseInt(page);
int Limit = Integer.parseInt(limit);
List<fenye> lis = new ArrayList<>();
try {
statement=connection.createStatement();
resultSet=statement.executeQuery(sql);
fenye bean = null;
while(resultSet.next()){
String username=resultSet.getString("username");
int id = resultSet.getInt("id");
String sex=resultSet.getString("sex");
String city=resultSet.getString("city");
String sign=resultSet.getString("sign");
String experience=resultSet.getString("experience");
String score=resultSet.getString("score");
String classify=resultSet.getString("classify");
String wealth=resultSet.getString("wealth");
bean = new fenye(id,username,sex,city,sign,experience,score,classify,wealth);
lis.add(bean);
}
} catch (SQLException e) {
e.printStackTrace();
}
DBUtil.close(resultSet,statement,connection);
List<fenye> list = new ArrayList<>();
int start=(Page-1)*Limit;//判断当前也开始的数据位置
for (int i =start; i <start+Limit&&i<lis.size(); i++) {
list.add(lis.get(i));
}
return list;
}
}
数据库表就不放了,按照jsp界面的数据或者dao层数据建表即可