Spring+MyBatis+Ajax 实现无刷新分页
1.导入相关jar:放在文章尾部
2.环境搭建,编写相关配置文件:
web.xml:
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0"> <display-name>AjaxPage</display-name> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> <!-- 上下文参数 --> <context-param> <param-name>contextConfigLocation</param-name> <param-value>classpath:applicationContext.xml</param-value> </context-param> <!-- 监听器 把spring核心配置文件信息装载到applicationContext --> <listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> </listener> </web-app>
applicationContext.xml:
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx" xmlns:context="http://www.springframework.org/schema/context" xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd" default-autowire="byName"> <!-- 扫描组件,扫描注解 --> <context:component-scan base-package="com.tao.service.impl"></context:component-scan> <!-- 加载属性配置文件 --> <context:property-placeholder location="classpath:db.properties"/> <!-- 数据源 --> <bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource"> <property name="driverClassName" value="${jdbc.driver}"></property> <property name="url" value="${jdbc.url}"></property> <property name="username" value="${jdbc.username}"></property> <property name="password" value="${jdbc.password}"></property> </bean> <!-- 创建SqlSessionFactory --> <bean id="factory" class="org.mybatis.spring.SqlSessionFactoryBean"> <property name="typeAliasesPackage" value="com.tao.pojo"></property> </bean> <!-- 扫描器 --> <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"> <property name="basePackage" value="com.tao.mapper"></property> <!-- 如果不使用这个属性会调用属性文件加载不到 --> <property name="sqlSessionFactoryBeanName" value="factory"></property> </bean> <!-- 配置事务管理器 --> <bean id="txManage" class="org.springframework.jdbc.datasource.DataSourceTransactionManager"></bean> <!-- 配置声明式事务 --> <tx:advice id="txAdvice" transaction-manager="txManage"> <tx:attributes> <tx:method name="ins*"/> <tx:method name="upd*"/> <tx:method name="del*"/> <tx:method name="*" read-only="true"/> </tx:attributes> </tx:advice> <!-- 配置aop --> <aop:config> <aop:pointcut expression="execution(* com.tao.service.impl.*.*(..))" id="mypoint"/> <aop:advisor advice-ref="txAdvice" pointcut-ref="mypoint"/> </aop:config> <!-- 表示使用cglib动态代理 注解这块都是基于cglib做的--> <aop:aspectj-autoproxy proxy-target-class="true"></aop:aspectj-autoproxy> </beans>
db.properties:
jdbc.driver=com.mysql.jdbc.Driver jdbc.url = jdbc:mysql://localhost:3306/ssm jdbc.username = root jdbc.password = root
实体类:
package com.tao.pojo; public class Dept { private int id; private String name; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } }
package com.tao.pojo; public class Emp { private int id; private String empno; private String name; private int deptid; private Dept dept; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getEmpno() { return empno; } public void setEmpno(String empno) { this.empno = empno; } public String getName() { return name; } public void setName(String name) { this.name = name; } public int getDeptid() { return deptid; } public void setDeptid(int deptid) { this.deptid = deptid; } public Dept getDept() { return dept; } public void setDept(Dept dept) { this.dept = dept; } }
package com.tao.pojo; import java.util.List; public class PageInfo { private int pageSize; private int pageNumber; private long total; private List<?> list; public int getPageSize() { return pageSize; } public void setPageSize(int pageSize) { this.pageSize = pageSize; } public int getPageNumber() { return pageNumber; } public void setPageNumber(int pageNumber) { this.pageNumber = pageNumber; } public long getTotal() { return total; } public void setTotal(long total) { this.total = total; } public List<?> getList() { return list; } public void setList(List<?> list) { this.list = list; } }
数据层接口及映射文件:
package com.tao.mapper; import java.util.List; import com.tao.pojo.Emp; public interface EmpMapper { //查询员工及其部门 List<Emp> selByPage(int pageStart,int pageSize); //查询员工总记录数 long selCount(); }
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="com.tao.mapper.EmpMapper"> <!-- property 表示实体类中定义的名称 column查询数据库返回的列名 也可以自己起别名 --> <resultMap type="Emp" id="empMap"> <id column="id" property="id"/> <result column="empno" property="empno"/> <result column="name" property="name"/> <result column="deptid" property="deptid"/> <association property="dept" javaType="Dept" resultMap="deptMap" /> </resultMap> <resultMap type="Dept" id="deptMap"> <id property="id" column="did"/> <id property="name" column="dname"/> </resultMap> <select id="selByPage" resultMap="empMap"> select e.*,d.id as did,d.name as dname from emp e left join dept d on e.deptid = d.id limit #{0},#{1} </select> <select id="selCount" resultType="long" > select count(*) from emp </select> </mapper>
关于 association 的使用,也有其他的写法 自己弄懂 会写就行
业务层及其实现类:
package com.tao.service; import com.tao.pojo.PageInfo; public interface EmpService { PageInfo show(int pageSize,int pageNumber); }
package com.tao.service.impl; import javax.annotation.Resource; import org.springframework.stereotype.Service; import com.tao.mapper.EmpMapper; import com.tao.pojo.PageInfo; import com.tao.service.EmpService; @Service public class EmpServiceImpl implements EmpService{ @Resource private EmpMapper empMapper; @Override public PageInfo show(int pageSize, int pageNumber) { PageInfo p = new PageInfo(); p.setPageSize(pageSize); p.setPageNumber(pageNumber); p.setList(empMapper.selByPage(pageSize*(pageNumber-1), pageSize)); long count = empMapper.selCount(); p.setTotal(count%pageSize==0?count/pageSize:count/pageSize+1); return p; } }
控制层:
package com.tao.servlet; import java.io.IOException; import java.io.PrintWriter; 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 org.springframework.web.context.WebApplicationContext; import org.springframework.web.context.support.WebApplicationContextUtils; import com.fasterxml.jackson.databind.ObjectMapper; import com.tao.pojo.PageInfo; import com.tao.service.EmpService; import com.tao.service.impl.EmpServiceImpl; @WebServlet("/show") public class ShowServlet extends HttpServlet{ private EmpService empService; private static final long serialVersionUID = 1L; @Override public void init() throws ServletException { //spring在web项目中容器是webApplicationContext WebApplicationContext wac = WebApplicationContextUtils.getRequiredWebApplicationContext(getServletContext()); empService = wac.getBean("empServiceImpl",EmpServiceImpl.class); } @Override protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { resp.setContentType("application/json;charset=utf-8"); int pageSize = Integer.parseInt(req.getParameter("pageSize")); int pageNumber = Integer.parseInt(req.getParameter("pageNumber")); PageInfo p = empService.show(pageSize, pageNumber); PrintWriter out = resp.getWriter(); ObjectMapper objectMapper = new ObjectMapper(); out.println(objectMapper.writeValueAsString(p)); out.flush(); out.close(); } }
index.jsp:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="js/jquery-1.7.2.js"></script> <script type="text/javascript"> $(function(){ var pageSize = 2; var pageNumber = 1; var total = 0; //默认调用一次,加载数据 getMyData(); //上一页 $("a:eq(0)").click(function(){ pageNumber = pageNumber-1; if(pageNumber>=1){ getMyData(); }else{ pageNumber=1; } return false; }); //下一页 $("a:eq(1)").click(function(){ pageNumber = pageNumber+1; if(pageNumber<=total){ getMyData(); }else{ pageNumber = total; } return false; }); function getMyData(){ $.post("show",{"pageNumber":pageNumber,"pageSize":pageSize},function(data){ //总页数 total = data.total; var result = ""; for(var i=0;i<data.list.length;i++){ result+="<tr>"; result+="<td>"+data.list[i].empno+"</td>"; result+="<td>"+data.list[i].name+"</td>"; result+="<td>"+data.list[i].dept.name+"</td>"; result+="</tr>"; } $("#mytbody").html(result); }); } }) </script> <title>Insert title here</title> </head> <body> <table border="1"> <tr> <td>员工编号</td> <td>姓名</td> <td>所在部门</td> </tr> <tbody id="mytbody"></tbody> </table> <a href="">上一页</a> <a href="">下一页</a> </body> </html>
相关jar: