Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)

时间:2022-02-08 21:39:05

林炳文Evankaka原创作品。转载请注明出处http://blog.csdn.net/evankaka

摘要:本文实现了一个后台由Spring+Mybatis+SpringMVC组成,分页采用PageHelper,前台展示使用bootstrap-paginator来显示效果的分页实例。整个项目由maven构成。这里主要讲了分页的实例,框架怎么搭建就不再说明,主要是在这里的基础上来增加分页功能的。注意,此文是在这个基础 Spring+Mybatis+SpringMVC+Maven+MySql搭建实例 之上来做分页的,建议文中看不懂的配置可以看看这里。

整个工程下载(旧版本,日志打印使用log4j,数据库配置放在properties文件)

新版本下载:https://github.com/appleappleapple/ssm_project(日志打印使用logback,数据库配置放在POM.XML)博主推荐使用新版本,而且这里详细说明了整个工程应用的框架,数据源配置,SQL语句等等!

重要的事情说三遍:请下新版本~请下新版本~请下新版本~

最后的结果如下:

Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)

环境:jdk1.6

Tomcat 7.0

Eclipse luna/windows 7

一、后台PageHelper使用

PageHelper:https://github.com/pagehelper/Mybatis-PageHelper

1、引入jar包

  1. <!-- 添加分布插件的包pagehelper -->
  2. <dependency>
  3. <groupId>com.github.pagehelper</groupId>
  4. <artifactId>pagehelper</artifactId>
  5. <version>4.0.0</version>
  6. </dependency>

2.mybatis-config.xml中添加插件

  1. <plugins>
  2. <!-- com.github.pagehelper为PageHelper类所在包名 -->
  3. <plugin interceptor="com.github.pagehelper.PageHelper">
  4. <property name="dialect" value="mysql"/>
  5. <!-- 该参数默认为false -->
  6. <!-- 设置为true时,会将RowBounds第一个参数offset当成pageNum页码使用 -->
  7. <!-- 和startPage中的pageNum效果一样-->
  8. <property name="offsetAsPageNum" value="true"/>
  9. <!-- 该参数默认为false -->
  10. <!-- 设置为true时,使用RowBounds分页会进行count查询 -->
  11. <property name="rowBoundsWithCount" value="true"/>
  12. <!-- 设置为true时,如果pageSize=0或者RowBounds.limit = 0就会查询出全部的结果 -->
  13. <!-- (相当于没有执行分页查询,但是返回结果仍然是Page类型)-->
  14. <property name="pageSizeZero" value="true"/>
  15. <!-- 3.3.0版本可用 - 分页参数合理化,默认false禁用 -->
  16. <!-- 启用合理化时,如果pageNum<1会查询第一页,如果pageNum>pages会查询最后一页 -->
  17. <!-- 禁用合理化时,如果pageNum<1或pageNum>pages会返回空数据 -->
  18. <property name="reasonable" value="false"/>
  19. <!-- 3.5.0版本可用 - 为了支持startPage(Object params)方法 -->
  20. <!-- 增加了一个`params`参数来配置参数映射,用于从Map或ServletRequest中取值 -->
  21. <!-- 可以配置pageNum,pageSize,count,pageSizeZero,reasonable,不配置映射的用默认值 -->
  22. <!-- 不理解该含义的前提下,不要随便复制该配置 -->
  23. <property name="params" value="pageNum=start;pageSize=limit;"/>
  24. </plugin>
  25. </plugins>

这样子就引入进来了,接下来就是来开始分页功能的实现

3、mapper文件中添加如下一个方法:

  1. <select id="selectUserByUserName" parameterType="java.lang.String" resultMap="BaseResultMap">
  2. SELECT *
  3. FROM t_user
  4. WHERE 1 = 1
  5. <if test="userName != null and userName !=''">
  6. AND USER_NAME = #{userName,jdbcType=VARCHAR}
  7. </if>
  8. ORDER BY USER_ID
  9. </select>

注意,这里的返回其实是一个list

  1. <!--设置domain类和数据库中表的字段一一对应,注意数据库字段和domain类中的字段名称不致,此处一定要! -->
  2. <resultMap id="BaseResultMap" type="com.lin.domain.User">
  3. <id column="USER_ID" property="userId" jdbcType="INTEGER" />
  4. <result column="USER_NAME" property="userName" jdbcType="CHAR" />
  5. <result column="USER_PASSWORD" property="userPassword" jdbcType="CHAR" />
  6. <result column="USER_EMAIL" property="userEmail" jdbcType="CHAR" />
  7. </resultMap>

4、然后就是dao类

  1. /**
  2. *
  3. * @author linbingwen
  4. * @since  2015年10月22日
  5. * @param userName
  6. * @return
  7. */
  8. List<User> selectUserByUserName(@Param("userName") String userName);

这里一定的记得加@Param("userName")

接下来就可以在service层中添加分页查询的的接口了

5、接口类

  1. /**
  2. *
  3. * @author linbingwen
  4. * @since  2015年10月23日
  5. * @param userName 查询条件,可为空
  6. * @param pageNo 查询条件,可为空,默认取1
  7. * @param pageSize 查询条件,可为空,默认取10
  8. * @return
  9. */
  10. PagedResult<User> queryByPage(String userName,Integer pageNo,Integer pageSize);

6、实现类

  1. public PagedResult<User> queryByPage(String userName,Integer pageNo,Integer pageSize ) {
  2. pageNo = pageNo == null?1:pageNo;
  3. pageSize = pageSize == null?10:pageSize;
  4. PageHelper.startPage(pageNo,pageSize);  //startPage是告诉拦截器说我要开始分页了。分页参数是这两个。
  5. return BeanUtil.toPagedResult(userDao.selectUserByUserName(userName));
  6. }

这里就可以直接在返回里头使用了PageHelper,这里userDao.selectUserByUserName(userName)的返回是一个list

其中,PagedResult是我自己封装的一个分页结果类

  1. package com.lin.util;
  2. import java.util.List;
  3. import com.lin.dto.BaseEntity;
  4. /**
  5. * 功能概要:
  6. *
  7. * @author linbingwen
  8. * @since  2015年10月23日
  9. */
  10. public class PagedResult<T> extends BaseEntity {
  11. /*serialVersionUID*/
  12. private static final long serialVersionUID = 1L;
  13. private List<T> dataList;//数据
  14. private long pageNo;//当前页
  15. private long pageSize;//条数
  16. private long total;//总条数
  17. private long pages;//总页面数目
  18. public List<T> getDataList() {
  19. return dataList;
  20. }
  21. public void setDataList(List<T> dataList) {
  22. this.dataList = dataList;
  23. }
  24. public long getPageNo() {
  25. return pageNo;
  26. }
  27. public void setPageNo(long pageNo) {
  28. this.pageNo = pageNo;
  29. }
  30. public long getPageSize() {
  31. return pageSize;
  32. }
  33. public void setPageSize(long pageSize) {
  34. this.pageSize = pageSize;
  35. }
  36. public long getTotal() {
  37. return total;
  38. }
  39. public void setTotal(long total) {
  40. this.total = total;
  41. }
  42. public long getPages() {
  43. return pages;
  44. }
  45. public void setPages(long pages) {
  46. this.pages = pages;
  47. }
  48. }

这是它的基类

  1. package com.lin.dto;
  2. import java.io.Serializable;
  3. import java.lang.reflect.Method;
  4. import java.lang.reflect.Modifier;
  5. import java.util.ArrayList;
  6. import java.util.HashMap;
  7. import java.util.List;
  8. import java.util.Map;
  9. /**
  10. *
  11. * <b>类说明:</b>bean基类
  12. *
  13. * <p>
  14. * <b>详细描述:</b>
  15. *
  16. * @author costin_law
  17. * @since 2014-5-5
  18. */
  19. public abstract class BaseEntity implements Serializable{
  20. private static final long serialVersionUID = 1L;
  21. private static Map<Class<?>,PropertyInfo[]> class2Props = new HashMap<Class<?>,PropertyInfo[]>(128);
  22. @Override
  23. public String toString() {
  24. PropertyInfo[] props = class2Props.get(this.getClass());
  25. if( props == null ){
  26. props = getProps(this.getClass());
  27. }
  28. StringBuilder   builder = new StringBuilder(1024);
  29. boolean isFirst = true;
  30. for (int i = 0, n = props.length; i < n; i++) {
  31. try {
  32. PropertyInfo propInfo = props[i];
  33. Object value = propInfo.getMethod.invoke(this, new Object[0]);
  34. if (isFirst)
  35. isFirst = false;
  36. else
  37. builder.append(",");
  38. builder.append(propInfo.propName);
  39. builder.append(":");
  40. if (value instanceof String)
  41. builder.append("\"");
  42. builder.append(value);
  43. if (value instanceof String)
  44. builder.append("\"");
  45. } catch (Exception e) {
  46. // ignore
  47. }
  48. }
  49. return "{" + builder.toString() + "}";
  50. }
  51. private static PropertyInfo[] getProps(Class<? extends BaseEntity> clazz) {
  52. PropertyInfo[] props;
  53. Method[] allMethods = clazz.getMethods();
  54. List<PropertyInfo> propList = new ArrayList<PropertyInfo>();
  55. for (int i = 0, n = allMethods.length; i < n; i++) {
  56. try {
  57. Method method = allMethods[i];
  58. if ((method.getModifiers() & Modifier.PUBLIC) == 1
  59. && method.getDeclaringClass() != Object.class
  60. && (method.getParameterTypes() == null || method
  61. .getParameterTypes().length == 0)) {
  62. String methodName = method.getName();
  63. if (methodName.startsWith("get") || methodName.startsWith("is") ) {
  64. PropertyInfo propInfo = new PropertyInfo();
  65. propInfo.getMethod = method;
  66. if (methodName.startsWith("get")) {
  67. propInfo.propName = methodName.substring(3, 4).toLowerCase()
  68. + methodName.substring(4);
  69. } else if (methodName.startsWith("is")) {
  70. propInfo.propName = methodName.substring(2, 3).toLowerCase()
  71. + methodName.substring(3);
  72. }
  73. propList.add(propInfo);
  74. }
  75. }
  76. }catch(Exception e){
  77. }
  78. }
  79. props =  new PropertyInfo[propList.size()];
  80. propList.toArray(props);
  81. class2Props.put(clazz, props);
  82. return props;
  83. }
  84. static class PropertyInfo{
  85. Method getMethod;
  86. String propName;
  87. }
  88. }

BeanUtil是一个将PageHelper返回的list转成pageResult的工具

  1. package com.lin.util;
  2. import java.util.List;
  3. import com.github.pagehelper.Page;
  4. import com.lin.util.PagedResult;
  5. /**
  6. * 功能概要:
  7. *
  8. * @author linbingwen
  9. * @since  2015年10月22日
  10. */
  11. public class BeanUtil {
  12. public static <T> PagedResult<T> toPagedResult(List<T> datas) {
  13. PagedResult<T> result = new PagedResult<T>();
  14. if (datas instanceof Page) {
  15. Page page = (Page) datas;
  16. result.setPageNo(page.getPageNum());
  17. result.setPageSize(page.getPageSize());
  18. result.setDataList(page.getResult());
  19. result.setTotal(page.getTotal());
  20. result.setPages(page.getPages());
  21. }
  22. else {
  23. result.setPageNo(1);
  24. result.setPageSize(datas.size());
  25. result.setDataList(datas);
  26. result.setTotal(datas.size());
  27. }
  28. return result;
  29. }
  30. }

7、这样就好了,可以跑单元测试了

  1. /**
  2. * 分页测试
  3. * @author linbingwen
  4. * @since  2015年10月22日
  5. */
  6. @Test
  7. public void queryByPage(){
  8. PagedResult<User>  pagedResult = userService.queryByPage(null,1,10);//null表示查全部
  9. logger.debug("查找结果" + pagedResult);
  10. }

输出结果:

Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)
看不清的话看下面
Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)

查找结果{total:46,dataList:Page{pageNum=1, pageSize=10, startRow=0, endRow=10, total=46, pages=5, reasonable=false,

pageSizeZero=true},pageNo:1,pageSize:10,pages:5}

其中的dataList中存放的就是数据

打个断点看下就知道了:

Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)

二、前台展示分页结果

前台展示主要使用了bootstrap-paginator,这里的原理其实就是将上面查出来的结果,转换成json数据传给前台,然后前台再根据条数和分页数目、总目生成表格,同时每次点击对应的按钮都发送一个ajax请求到后台查询应对的数据,前台每次发送到后台都会包含分页数目、查询条件

1、Controller层的基类

这个基类主要实现了将数据转成json

引用到的jar包如下:

  1. <!-- 添加json的依赖包 -->
  2. <dependency>
  3. <groupId>net.sf.json-lib</groupId>
  4. <artifactId>json-lib</artifactId>
  5. <version>2.3</version>
  6. <classifier>jdk15</classifier>
  7. </dependency>
  8. <dependency>
  9. <groupId>org.springframework.data</groupId>
  10. <artifactId>spring-data-commons</artifactId>
  11. <version>1.6.1.RELEASE</version>
  12. </dependency>
  13. <dependency>
  14. <groupId>org.springframework.data</groupId>
  15. <artifactId>spring-data-jpa</artifactId>
  16. <version>1.4.1.RELEASE</version>
  17. </dependency>
  18. <dependency>
  19. <groupId>com.alibaba</groupId>
  20. <artifactId>fastjson</artifactId>
  21. <version>1.1.34</version>
  22. </dependency>

基类如下:

  1. package com.lin.controller;
  2. import com.lin.common.HttpConstants;
  3. import com.lin.json.JsonDateValueProcessor;
  4. import net.sf.json.JSONArray;
  5. import net.sf.json.JSONObject;
  6. import net.sf.json.JsonConfig;
  7. import org.slf4j.Logger;
  8. import org.slf4j.LoggerFactory;
  9. import java.util.Date;
  10. /**
  11. * Controller基类
  12. */
  13. public class BaseController {
  14. protected Logger logger = LoggerFactory.getLogger(this.getClass());
  15. protected final static String DATE_FORMATE = "yyyy-MM-dd";
  16. /**
  17. * 返回服务端处理结果
  18. * @param obj 服务端输出对象
  19. * @return 输出处理结果给前段JSON格式数据
  20. * @author YANGHONGXIA
  21. * @since 2015-01-06
  22. */
  23. public String responseResult(Object obj){
  24. JSONObject jsonObj = null;
  25. if(obj != null){
  26. logger.info("后端返回对象:{}", obj);
  27. JsonConfig jsonConfig = new JsonConfig();
  28. jsonConfig.registerJsonValueProcessor(Date.class, new JsonDateValueProcessor());
  29. jsonObj = JSONObject.fromObject(obj, jsonConfig);
  30. logger.info("后端返回数据:" + jsonObj);
  31. if(HttpConstants.SERVICE_RESPONSE_SUCCESS_CODE.equals(jsonObj.getString(HttpConstants.SERVICE_RESPONSE_RESULT_FLAG))){
  32. jsonObj.element(HttpConstants.RESPONSE_RESULT_FLAG_ISERROR, false);
  33. jsonObj.element(HttpConstants.SERVICE_RESPONSE_RESULT_MSG, "");
  34. }else{
  35. jsonObj.element(HttpConstants.RESPONSE_RESULT_FLAG_ISERROR, true);
  36. String errMsg = jsonObj.getString(HttpConstants.SERVICE_RESPONSE_RESULT_MSG);
  37. jsonObj.element(HttpConstants.SERVICE_RESPONSE_RESULT_MSG, errMsg==null?HttpConstants.SERVICE_RESPONSE_NULL:errMsg);
  38. }
  39. }
  40. logger.info("输出结果:{}", jsonObj.toString());
  41. return jsonObj.toString();
  42. }
  43. /**
  44. * 返回成功
  45. * @param obj 输出对象
  46. * @return 输出成功的JSON格式数据
  47. */
  48. public String responseSuccess(Object obj){
  49. JSONObject jsonObj = null;
  50. if(obj != null){
  51. logger.info("后端返回对象:{}", obj);
  52. JsonConfig jsonConfig = new JsonConfig();
  53. jsonConfig.registerJsonValueProcessor(Date.class, new JsonDateValueProcessor());
  54. jsonObj = JSONObject.fromObject(obj, jsonConfig);
  55. logger.info("后端返回数据:" + jsonObj);
  56. jsonObj.element(HttpConstants.RESPONSE_RESULT_FLAG_ISERROR, false);
  57. jsonObj.element(HttpConstants.SERVICE_RESPONSE_RESULT_MSG, "");
  58. }
  59. logger.info("输出结果:{}", jsonObj.toString());
  60. return jsonObj.toString();
  61. }
  62. /**
  63. * 返回成功
  64. * @param obj 输出对象
  65. * @return 输出成功的JSON格式数据
  66. */
  67. public String responseArraySuccess(Object obj){
  68. JSONArray jsonObj = null;
  69. if(obj != null){
  70. logger.info("后端返回对象:{}", obj);
  71. JsonConfig jsonConfig = new JsonConfig();
  72. jsonConfig.registerJsonValueProcessor(Date.class, new JsonDateValueProcessor());
  73. jsonObj = JSONArray.fromObject(obj, jsonConfig);
  74. logger.info("后端返回数据:" + jsonObj);
  75. }
  76. logger.info("输出结果:{}", jsonObj.toString());
  77. return jsonObj.toString();
  78. }
  79. /**
  80. * 返回成功
  81. * @param obj 输出对象
  82. * @return 输出成功的JSON格式数据
  83. */
  84. public String responseSuccess(Object obj, String msg){
  85. JSONObject jsonObj = null;
  86. if(obj != null){
  87. logger.info("后端返回对象:{}", obj);
  88. JsonConfig jsonConfig = new JsonConfig();
  89. jsonConfig.registerJsonValueProcessor(Date.class, new JsonDateValueProcessor());
  90. jsonObj = JSONObject.fromObject(obj, jsonConfig);
  91. logger.info("后端返回数据:" + jsonObj);
  92. jsonObj.element(HttpConstants.RESPONSE_RESULT_FLAG_ISERROR, false);
  93. jsonObj.element(HttpConstants.SERVICE_RESPONSE_RESULT_MSG, msg);
  94. }
  95. logger.info("输出结果:{}", jsonObj.toString());
  96. return jsonObj.toString();
  97. }
  98. /**
  99. * 返回失败
  100. * @param errorMsg 错误信息
  101. * @return 输出失败的JSON格式数据
  102. */
  103. public String responseFail(String errorMsg){
  104. JSONObject jsonObj = new JSONObject();
  105. jsonObj.put(HttpConstants.RESPONSE_RESULT_FLAG_ISERROR, true);
  106. jsonObj.put(HttpConstants.SERVICE_RESPONSE_RESULT_MSG, errorMsg);
  107. logger.info("输出结果:{}", jsonObj.toString());
  108. return jsonObj.toString();
  109. }
  110. }

上面用到的一些变量如下:

  1. package com.lin.common;
  2. public class HttpConstants {
  3. public static final String SYSTEM_ERROR_MSG = "系统错误";
  4. public static final String REQUEST_PARAMS_NULL = "请求参数为空";
  5. public static final String SERVICE_RESPONSE_NULL = "服务端返回结果为空";
  6. // 服务端返回成功的标志
  7. public static final String SERVICE_RESPONSE_SUCCESS_CODE = "AMS00000";
  8. // 服务端返回结果的标志
  9. public static final String SERVICE_RESPONSE_RESULT_FLAG = "returnCode";
  10. // 服务端返回结果失败的标志
  11. public static final String SERVICE_RESPONSE_RESULT_MSG = "errorMsg";
  12. // 返回给前段页面成功或失败的标志
  13. public static final String RESPONSE_RESULT_FLAG_ISERROR = "isError";
  14. // 执行删除操作
  15. public static final String OPERATION_TYPE_DELETE = "D";
  16. public static final String ENUM_PATH = "com.mucfc.msm.enumeration.";
  17. }

引用一个包的内容如下:

  1. package com.lin.json;
  2. import net.sf.json.JsonConfig;
  3. import net.sf.json.processors.JsonValueProcessor;
  4. import java.text.SimpleDateFormat;
  5. import java.util.Date;
  6. import java.util.Locale;
  7. public class JsonDateValueProcessor implements JsonValueProcessor {
  8. /**
  9. * datePattern
  10. */
  11. private String datePattern = "yyyy-MM-dd HH:mm:ss";
  12. /**
  13. * JsonDateValueProcessor
  14. */
  15. public JsonDateValueProcessor() {
  16. super();
  17. }
  18. /**
  19. * @param format
  20. */
  21. public JsonDateValueProcessor(String format) {
  22. super();
  23. this.datePattern = format;
  24. }
  25. /**
  26. * @param value
  27. * @param jsonConfig
  28. * @return Object
  29. */
  30. public Object processArrayValue(Object value, JsonConfig jsonConfig) {
  31. return process(value);
  32. }
  33. /**
  34. * @param key
  35. * @param value
  36. * @param jsonConfig
  37. * @return Object
  38. */
  39. public Object processObjectValue(String key, Object value, JsonConfig jsonConfig) {
  40. return process(value);
  41. }
  42. /**
  43. * process
  44. *
  45. * @param value
  46. * @return
  47. */
  48. private Object process(Object value) {
  49. try {
  50. if (value instanceof Date) {
  51. SimpleDateFormat sdf = new SimpleDateFormat(datePattern, Locale.UK);
  52. return sdf.format((Date) value);
  53. }
  54. return value == null ? "" : value.toString();
  55. } catch (Exception e) {
  56. return "";
  57. }
  58. }
  59. /**
  60. * @return the datePattern
  61. */
  62. public String getDatePattern() {
  63. return datePattern;
  64. }
  65. /**
  66. * @param pDatePattern the datePattern to set
  67. */
  68. public void setDatePattern(String pDatePattern) {
  69. datePattern = pDatePattern;
  70. }
  71. }

这里主要实现了能将list/map/set/数组等转换成josn,并传到前台‘

2、光这里写不行,还得配置springMVC中以json来传递数据,并配置自己的字符过滤器,要不然中文传到前台可能乱码,这里的配置比较复杂,大部分时间都花在这里,

这里我直接放spingMVC的配置:spring-mvc.xml

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <beans xmlns="http://www.springframework.org/schema/beans"
  3. xmlns:p="http://www.springframework.org/schema/p"
  4. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  5. xmlns:context="http://www.springframework.org/schema/context"
  6. xmlns:mvc="http://www.springframework.org/schema/mvc"
  7. xsi:schemaLocation="
  8. http://www.springframework.org/schema/beans
  9. http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
  10. http://www.springframework.org/schema/context
  11. http://www.springframework.org/schema/context/spring-context-3.2.xsd
  12. http://www.springframework.org/schema/mvc
  13. http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd">
  14. <!-- 扫描controller(controller层注入) -->
  15. <context:component-scan base-package="com.lin.controller" use-default-filters="false">
  16. <context:include-filter type="annotation" expression="org.springframework.stereotype.Controller"/>
  17. <context:include-filter type="annotation" expression="org.springframework.web.bind.annotation.ControllerAdvice"/>
  18. </context:component-scan>
  19. <!-- 会自动注册了validator  ConversionService  -->
  20. <mvc:annotation-driven validator="validator" conversion-service="conversionService" content-negotiation-manager="contentNegotiationManager">
  21. <mvc:message-converters register-defaults="true">
  22. <!-- StringHttpMessageConverter编码为UTF-8,防止乱码 -->
  23. <bean class="org.springframework.http.converter.StringHttpMessageConverter">
  24. <constructor-arg value="UTF-8"/>
  25. <property name = "supportedMediaTypes">
  26. <list>
  27. <bean class="org.springframework.http.MediaType">
  28. <constructor-arg index="0" value="text"/>
  29. <constructor-arg index="1" value="plain"/>
  30. <constructor-arg index="2" value="UTF-8"/>
  31. </bean>
  32. <bean class="org.springframework.http.MediaType">
  33. <constructor-arg index="0" value="*"/>
  34. <constructor-arg index="1" value="*"/>
  35. <constructor-arg index="2" value="UTF-8"/>
  36. </bean>
  37. </list>
  38. </property>
  39. </bean>
  40. <!-- 避免IE执行AJAX时,返回JSON出现下载文件 -->
  41. <bean id="fastJsonHttpMessageConverter" class="com.alibaba.fastjson.support.spring.FastJsonHttpMessageConverter">
  42. <property name="supportedMediaTypes">
  43. <list>
  44. <value>application/json;charset=UTF-8</value>
  45. </list>
  46. </property>
  47. <!--<property name="serializerFeature">-->
  48. <!--这个地方加上这个功能吧,能自己配置一些东西,比如时间的格式化,null输出""等等-->
  49. <!--</property>-->
  50. </bean>
  51. </mvc:message-converters>
  52. <mvc:argument-resolvers>
  53. <bean class="org.springframework.data.web.PageableHandlerMethodArgumentResolver" />
  54. </mvc:argument-resolvers>
  55. </mvc:annotation-driven>
  56. <!-- 内容协商管理器  -->
  57. <!--1、首先检查路径扩展名(如my.pdf);2、其次检查Parameter(如my?format=pdf);3、检查Accept Header-->
  58. <bean id="contentNegotiationManager" class="org.springframework.web.accept.ContentNegotiationManagerFactoryBean">
  59. <!-- 扩展名至mimeType的映射,即 /user.json => application/json -->
  60. <property name="favorPathExtension" value="true"/>
  61. <!-- 用于开启 /userinfo/123?format=json 的支持 -->
  62. <property name="favorParameter" value="true"/>
  63. <property name="parameterName" value="format"/>
  64. <!-- 是否忽略Accept Header -->
  65. <property name="ignoreAcceptHeader" value="false"/>
  66. <property name="mediaTypes"> <!--扩展名到MIME的映射;favorPathExtension, favorParameter是true时起作用  -->
  67. <value>
  68. json=application/json
  69. xml=application/xml
  70. html=text/html
  71. </value>
  72. </property>
  73. <!-- 默认的content type -->
  74. <property name="defaultContentType" value="text/html"/>
  75. </bean>
  76. <!-- 当在web.xml 中   DispatcherServlet使用 <url-pattern>/</url-pattern> 映射时,能映射静态资源 -->
  77. <mvc:default-servlet-handler />
  78. <!-- 静态资源映射 -->
  79. <mvc:resources mapping="/static/**" location="/WEB-INF/static/"/>
  80. <!-- 对模型视图添加前后缀 -->
  81. <bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver"
  82. p:prefix="/WEB-INF/view/" p:suffix=".jsp"/>
  83. <!-- 这里设置静态的资源 -->
  84. <!--     <mvc:resources location="/static/" mapping="/static/**" /> -->
  85. </beans>

3、Spirng中也和配置:

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <beans xmlns="http://www.springframework.org/schema/beans"
  3. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
  4. xmlns:aop="http://www.springframework.org/schema/aop"
  5. xsi:schemaLocation="
  6. http://www.springframework.org/schema/beans
  7. http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
  8. http://www.springframework.org/schema/aop
  9. http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
  10. http://www.springframework.org/schema/context
  11. http://www.springframework.org/schema/context/spring-context-3.0.xsd">
  12. <!-- 以下 validator  ConversionService 在使用 mvc:annotation-driven 会 自动注册-->
  13. <bean id="validator" class="org.springframework.validation.beanvalidation.LocalValidatorFactoryBean">
  14. </bean>
  15. <!-- 引入jdbc配置文件 -->
  16. <bean id="propertyConfigurer" class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer">
  17. <property name="locations">
  18. <list>
  19. <value>classpath:properties/*.properties</value>
  20. <!--要是有多个配置文件,只需在这里继续添加即可 -->
  21. </list>
  22. </property>
  23. </bean>
  24. <!-- 扫描注解Bean -->
  25. <context:component-scan base-package="com.lin.service">
  26. <context:exclude-filter type="annotation" expression="org.springframework.stereotype.Controller"/>
  27. </context:component-scan>
  28. <!-- 激活annotation功能 -->
  29. <context:annotation-config />
  30. <!-- 激活annotation功能 -->
  31. <context:spring-configured />
  32. <!-- 注解事务配置 -->
  33. <!-- 类型转换及数据格式化 -->
  34. <bean id="conversionService" class="org.springframework.format.support.FormattingConversionServiceFactoryBean"/>
  35. <!-- 配置数据源 -->
  36. <bean id="dataSource"
  37. class="org.springframework.jdbc.datasource.DriverManagerDataSource">
  38. <!-- 不使用properties来配置 -->
  39. <!-- <property name="driverClassName" value="com.mysql.jdbc.Driver" />
  40. <property name="url" value="jdbc:mysql://localhost:3306/learning" />
  41. <property name="username" value="root" />
  42. <property name="password" value="christmas258@" /> -->
  43. <!-- 使用properties来配置 -->
  44. <property name="driverClassName">
  45. <value>${jdbc_driverClassName}</value>
  46. </property>
  47. <property name="url">
  48. <value>${jdbc_url}</value>
  49. </property>
  50. <property name="username">
  51. <value>${jdbc_username}</value>
  52. </property>
  53. <property name="password">
  54. <value>${jdbc_password}</value>
  55. </property>
  56. </bean>
  57. <!-- 自动扫描了所有的XxxxMapper.xml对应的mapper接口文件,这样就不用一个一个手动配置Mpper的映射了,只要Mapper接口类和Mapper映射文件对应起来就可以了。 -->
  58. <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
  59. <property name="basePackage"
  60. value="com.lin.dao" />
  61. </bean>
  62. <!-- 配置Mybatis的文件 ,mapperLocations配置**Mapper.xml文件位置,configLocation配置mybatis-config文件位置-->
  63. <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
  64. <property name="dataSource" ref="dataSource" />
  65. <property name="mapperLocations" value="classpath*:com/lin/mapper/**/*.xml"/>
  66. <property name="configLocation" value="classpath:mybatis/mybatis-config.xml" />
  67. <!-- <property name="typeAliasesPackage" value="com.tiantian.ckeditor.model"
  68. /> -->
  69. </bean>
  70. </beans>

其中validator这个bean需要引用如下:

  1. <dependency>
  2. <groupId>javax.validation</groupId>
  3. <artifactId>validation-api</artifactId>
  4. <version>1.1.0.Final</version>
  5. </dependency>
  6. <dependency>
  7. <groupId>org.hibernate</groupId>
  8. <artifactId>hibernate-validator</artifactId>
  9. <version>5.0.1.Final</version>
  10. </dependency>

4、conroller层编写

  1. package com.lin.controller;
  2. import java.util.HashMap;
  3. import java.util.Map;
  4. import javax.annotation.Resource;
  5. import org.slf4j.Logger;
  6. import org.slf4j.LoggerFactory;
  7. import org.springframework.data.domain.Pageable;
  8. import org.springframework.stereotype.Controller;
  9. import org.springframework.web.bind.annotation.RequestMapping;
  10. import org.springframework.web.bind.annotation.RequestMethod;
  11. import org.springframework.web.bind.annotation.ResponseBody;
  12. import org.springframework.web.servlet.ModelAndView;
  13. import com.github.pagehelper.Page;
  14. import com.lin.domain.User;
  15. import com.lin.service.UserService;
  16. import com.lin.util.PagedResult;
  17. /**
  18. * 功能概要:UserController
  19. *
  20. * @author linbingwen
  21. * @since  2015年9月28日
  22. */
  23. @Controller
  24. public class UserController extends BaseController {
  25. private Logger logger = LoggerFactory.getLogger(getClass());
  26. @Resource
  27. private UserService userService;
  28. @RequestMapping("/")
  29. public ModelAndView getIndex(){
  30. ModelAndView mav = new ModelAndView("index");
  31. User user = userService.selectUserById(1);
  32. mav.addObject("user", user);
  33. return mav;
  34. }
  35. /**
  36. * 显示首页
  37. * @author linbingwen
  38. * @since  2015年10月23日
  39. * @return
  40. */
  41. @RequestMapping("/bootstrapTest1")
  42. public String bootStrapTest1(){
  43. return "bootstrap/bootstrapTest1";
  44. }
  45. /**
  46. * 分页查询用户信息
  47. * @author linbingwen
  48. * @since  2015年10月23日
  49. * @param page
  50. * @return
  51. */
  52. @RequestMapping(value="/list.do", method= RequestMethod.POST)
  53. @ResponseBody
  54. public String list(Integer pageNumber,Integer pageSize ,String userName) {
  55. logger.info("分页查询用户信息列表请求入参:pageNumber{},pageSize{}", pageNumber,pageSize);
  56. try {
  57. PagedResult<User> pageResult = userService.queryByPage(userName, pageNumber,pageSize);
  58. return responseSuccess(pageResult);
  59. } catch (Exception e) {
  60. return responseFail(e.getMessage());
  61. }
  62. }
  63. }

5、最后一步就是前台的页面了,这里可以先写页面再来写controller也可以的

  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
  2. pageEncoding="UTF-8"%>
  3. <!DOCTYPE html>
  4. <html lang="en">
  5. <head>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Bootstrap分页实例</title>
  8. <link href="<%=request.getContextPath()%>/static/js/bootstrap//css/bootstrap.min.css" rel="stylesheet">
  9. <script src="<%=request.getContextPath()%>/static/js/jQuery/jquery-2.1.4.min.js"></script>
  10. <script src="<%=request.getContextPath()%>/static/js/bootstrap/js/bootstrap.min.js"></script>
  11. <script src="<%=request.getContextPath()%>/static/js/bootstrap/js/bootstrap-paginator.min.js"></script>
  12. <style type="text/css">
  13. #queryDiv {
  14. margin-right: auto;
  15. margin-left: auto;
  16. width:600px;
  17. }
  18. #textInput {
  19. margin-top: 10px;
  20. }
  21. #tableResult {
  22. margin-right: auto;
  23. margin-left: auto;
  24. width:600px;
  25. }
  26. td {
  27. width:150px
  28. }
  29. </style>
  30. </head>
  31. <body>
  32. <div id = "queryDiv">
  33. <input id = "textInput" type="text" placeholder="请输入用户名" >
  34. <button id = "queryButton" class="btn btn-primary" type="button">查询</button>
  35. </div>
  36. <form id="form1">
  37. <table class="table table-bordered" id = 'tableResult'>
  38. <caption>查询用户结果</caption>
  39. <thead>
  40. <tr>
  41. <th>序号</th>
  42. <th>用户名</th>
  43. <th>密码</th>
  44. <th>用户邮箱</th>
  45. </tr>
  46. </thead>
  47. <tbody id="tableBody">
  48. </tbody>
  49. </table>
  50. <!-- 底部分页按钮 -->
  51. <div id="bottomTab"></div>
  52. </form>
  53. <script type='text/javascript'>
  54. var PAGESIZE = 10;
  55. var options = {
  56. currentPage: 1,  //当前页数
  57. totalPages: 10,  //总页数,这里只是暂时的,后头会根据查出来的条件进行更改
  58. size:"normal",
  59. alignment:"center",
  60. itemTexts: function (type, page, current) {
  61. switch (type) {
  62. case "first":
  63. return "第一页";
  64. case "prev":
  65. return "前一页";
  66. case "next":
  67. return "后一页";
  68. case "last":
  69. return "最后页";
  70. case "page":
  71. return  page;
  72. }
  73. },
  74. onPageClicked: function (e, originalEvent, type, page) {
  75. var userName = $("#textInput").val(); //取内容
  76. buildTable(userName,page,PAGESIZE);//默认每页最多10条
  77. }
  78. }
  79. //获取当前项目的路径
  80. var urlRootContext = (function () {
  81. var strPath = window.document.location.pathname;
  82. var postPath = strPath.substring(0, strPath.substr(1).indexOf('/') + 1);
  83. return postPath;
  84. })();
  85. //生成表格
  86. function buildTable(userName,pageNumber,pageSize) {
  87. var url =  urlRootContext + "/list.do"; //请求的网址
  88. var reqParams = {'userName':userName, 'pageNumber':pageNumber,'pageSize':pageSize};//请求数据
  89. $(function () {
  90. $.ajax({
  91. type:"POST",
  92. url:url,
  93. data:reqParams,
  94. async:false,
  95. dataType:"json",
  96. success: function(data){
  97. if(data.isError == false) {
  98. // options.totalPages = data.pages;
  99. var newoptions = {
  100. currentPage: 1,  //当前页数
  101. totalPages: data.pages==0?1:data.pages,  //总页数
  102. size:"normal",
  103. alignment:"center",
  104. itemTexts: function (type, page, current) {
  105. switch (type) {
  106. case "first":
  107. return "第一页";
  108. case "prev":
  109. return "前一页";
  110. case "next":
  111. return "后一页";
  112. case "last":
  113. return "最后页";
  114. case "page":
  115. return  page;
  116. }
  117. },
  118. onPageClicked: function (e, originalEvent, type, page) {
  119. var userName = $("#textInput").val(); //取内容
  120. buildTable(userName,page,PAGESIZE);//默认每页最多10条
  121. }
  122. }
  123. $('#bottomTab').bootstrapPaginator("setOptions",newoptions); //重新设置总页面数目
  124. var dataList = data.dataList;
  125. $("#tableBody").empty();//清空表格内容
  126. if (dataList.length > 0 ) {
  127. $(dataList).each(function(){//重新生成
  128. $("#tableBody").append('<tr>');
  129. $("#tableBody").append('<td>' + this.userId + '</td>');
  130. $("#tableBody").append('<td>' + this.userName + '</td>');
  131. $("#tableBody").append('<td>' + this.userPassword + '</td>');
  132. $("#tableBody").append('<td>' + this.userEmail + '</td>');
  133. $("#tableBody").append('</tr>');
  134. });
  135. } else {
  136. $("#tableBody").append('<tr><th colspan ="4"><center>查询无数据</center></th></tr>');
  137. }
  138. }else{
  139. alert(data.errorMsg);
  140. }
  141. },
  142. error: function(e){
  143. alert("查询失败:" + e);
  144. }
  145. });
  146. });
  147. }
  148. //渲染完就执行
  149. $(function() {
  150. //生成底部分页栏
  151. $('#bottomTab').bootstrapPaginator(options);
  152. buildTable("",1,10);//默认空白查全部
  153. //创建结算规则
  154. $("#queryButton").bind("click",function(){
  155. var userName = $("#textInput").val();
  156. buildTable(userName,1,PAGESIZE);
  157. });
  158. });
  159. </script>
  160. </body>
  161. </html>

注意引入的js文件,bootstrap-paginator需要引用bootstrap和jquery

6、最终运行结果

最后以web工程运行就可以了:

结果如下:

Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)

打印出来的一些日志:

Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)

后台返回给前台的就是json

整个工程下载(旧版本)

新版本下载:https://github.com/appleappleapple/ssm_project(日志打印使用logback,数据库配置放在POM.XML)博主推荐使用新版本,而且这里详细说明了整个工程应用的框架,数据源配置,SQL语句等等!

重要的事情说三遍:请下新版本~请下新版本~请下新版本~

from: http://blog.csdn.net/evankaka/article/details/49452201

Spring+Mybatis+SpringMVC后台与前台分页展示实例(附工程)的更多相关文章

  1. Spring&plus;Mybatis&plus;SpringMVC后台与前台分页展示实例(附工程)(转)

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:本文实现了一个后台由Spring+Mybatis+SpringMVC组成,分页采用Pag ...

  2. Spring&plus;Mybatis&plus;SpringMVC后台与前台分页展示实例

    摘要:本文实现了一个后台由spring+Mybatis+SpringMVC组成,分页采用PageHelper,前台展示使用bootstrap-paginator来显示效果的分页实例.整个项目由mave ...

  3. Spring&plus;Mybatis&plus;SpringMVC&plus;Maven&plus;MySql搭建实例

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:本文主要讲了如何使用Maven来搭建Spring+Mybatis+SpringMVC+M ...

  4. 【转】Spring&plus;Mybatis&plus;SpringMVC&plus;Maven&plus;MySql搭建实例

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:本文主要讲了如何使用Maven来搭建Spring+Mybatis+SpringMVC+M ...

  5. spring mybatis springmvc整合

    使用SSM(Spring.SpringMVC和Mybatis)已经有三个多月了,项目在技术上已经没有什么难点了,基于现有的技术就可以实现想要的功能,当然肯定有很多可以改进的地方.之前没有记录SSM整合 ...

  6. mybatis学习笔记(五) -- maven&plus;spring&plus;mybatis从零开始搭建整合详细过程(附demo和搭建过程遇到的问题解决方法)

    文章介绍结构一览 一.使用maven创建web项目 1.新建maven项目 2.修改jre版本 3.修改Project Facts,生成WebContent文件夾 4.将WebContent下的两个文 ...

  7. Spring&plus;Mybatis&plus;SpringMVC&plus;Maven&plus;MySql搭建实例&lpar;转&rpar;

    http://blog.csdn.net/evankaka/article/details/48785513?spm=5176.100239.blogcont28591.10.9Fdj9R

  8. Spring&plus;MyBatis&plus;SpringMvc整合Demo

    客户关系管理系统demo 项目分析 该demo使用技术及环境:ssm+maven+bootstrap+jsp+mysql+idea+jdk1.8 需求:客户管理,实现客户列表分页显示如下图 项目开始 ...

  9. spring&plus;mybatis&plus;springmvc的配置

    1.web.xml的配置 <?xml version="1.0" encoding="UTF-8"?><web-app version=&qu ...

随机推荐

  1. 工作中遇到的问题--实现CustomerSetting的实时更新

    首先在项目运行时就初始化CustomerSettings的值,采用@Bean,默认是singtone模式,只会加载一次. @Configuration@Order(3)@EnableWebMvcSec ...

  2. 为什么要配置path环境变量?

    一:关于path环境变量--为了在任意目录下,使用javac/java命令 第一种配置方法: 通过配置path环境变量,我们可以使某个程序,比如javac.exe,在任意目录下都可以运行,而不用跑到j ...

  3. 实现iota函数

    void Reverse(char *s) { char temp; char *p = s; char *q = s; while (*p != '\0') { p ++; } q --; whil ...

  4. 24&period;QTableView函数使用&comma;右击菜单实现

    QTableView view(this); QStandardItemModel model(this); /*设置表头水平标题*/ model.setHorizontalHeaderItem(,n ...

  5. 一次关于&lpar;&rpar;&equals;&gt&semi;&lpar;&lbrace;&rcub;&rpar;的使用

    今天遇到了一个问题,值得一记 首先在我看项目代码时发现了一个问题 有一个JS的export如下 大家可以注意一下config 这里为什么要如此写法呢? 首先这里用的时ES6的箭头函数 ()=>{ ...

  6. php程序调试方法

    可以参考鸟哥等人写的的"php调试技术手册.pdf" 主要分为内置api调试包括:echo.var_dump.print_f,error_log等 前端浏览器插件辅助调试 开源扩展 ...

  7. 在单片机上实现UDP

    http://blog.chinaunix.net/uid-18921523-id-260999.html

  8. kibana 创建饼图

    1.在 visualize 里面选择饼图 2.选择数据源 3.选择 terms 聚合类型. 选择字段 xxx.keyword 保存即可.

  9. 摇一摇js代码

    init(); var SHAKE_THRESHOLD = 3000; var last_update = 0; var x = y = z = last_x = last_y = last_z = ...

  10. windows forget jenkins password&period;

    1. goto the directory of jenkins. for example my installation is in D:\Program Files (x86)\Jenkins. ...