springMVC+ajax分页查询

项目用到ajax技术的查询,查询结果很多时候要分页展示。这两天摸索了一下,在这里做一总结,方便自己随时查看,

也方便后人参考。

这里的顺序遵从从前台页面到后台控制器,业务层,Dao层,Mapper

下面先讲页面,页面js代码如下:

[javascript] view plain copy print?
  1. "font-size:14px;">/* 全局变量 */  
  2. var userCount;//符合查找条件的用户总页数,分页参考  
  3. var pageIndex = 0;//当前页,默认为0  
  4. var pageSize = 8;//每页显示个数为8  
  5.   
  6. //按条件查找用户  
  7. function searchUser(index,size) {  
  8.     var findTerm = $("#serchTerm").val();  
  9.     var provinceId = $('#province').val();  
  10.     var cityId = $('#city').val();  
  11.     $.ajax({  
  12.         type : "POST",  
  13.         url : "user/findContactsAjax",  
  14.         cache : false,  
  15.         data : {  
  16.             provinceId : provinceId,  
  17.             cityId : cityId,  
  18.             pageIndex:index,  
  19.             pageSize:size  
  20.         },  
  21.         async : true,  
  22.         error : function() {  
  23.             alert("网络异常!");  
  24.         },  
  25.         success : function(data) {  
  26.         "white-space:pre">    userCount=Math.ceil(data[0].userCount/8);"white-space:pre">                                                  var page='共'  
  27.             +userCount+'页 第'  
  28.             +(pageIndex+1)+'页 首页 '  
  29.             +'上一页  '  
  30.             +'下一页  '  
  31.             +'尾页  ';  
  32.             page+='
';  
  •             $("#serchResult").append(page);  
  •             document.getElementById("dltitle").innerHTML = "查找结果如下";  
  •             }  
  •         }  
  •     });  
  • }  
  • //首页  
  • function GoToFirstPage() {  
  •     pageIndex = 0;  
  •     searchUser( pageIndex, pageSize);  
  • }  
  • //前一页  
  • function GoToPrePage() {  
  •     pageIndex -= 1;  
  •     pageIndex = pageIndex >= 0 ? pageIndex : 0;  
  •     searchUser( pageIndex, pageSize);  
  • }  
  • //后一页  
  • function GoToNextPage() {  
  •     if (pageIndex + 1 < userCount) {  
  •         pageIndex += 1;  
  •     }  
  •         searchUser( pageIndex, pageSize);  
  • }  
  • //尾页  
  • function GoToEndPage() {  
  •     pageIndex = userCount - 1;  
  •     searchUser( pageIndex, pageSize);  
  • }  

  • 控制层代码如下:

    [javascript] view plain copy print?
    1. @RequestMapping("findContactsAjax")  
    2.     public @ResponseBody  
    3.     Map findContactAjax(String provinceId,String cityId,String pageIndex,String pageSize) {  
    4.       
    5.     List listUsers = userDao.selectUserByProvinceAndCity(provinceId, cityId,pageIndex,pageSize)  
    6.         }  
    7.           
    8.         map.put("user", listUsers);  
    9.         return map;  
    10.     }  


    Dao层:

    [java] view plain copy print?
    1. List selectUserByProvinceAndCity(@Param("provinceId") Integer provinceId, @Param("cityId") Integer cityId,  
    2. @Param("pageIndex") Integer pageIndex,@Param("pageSize") Integer pageSize);  


    mapper文件:

    [html] view plain copy print?
    1. <select id="selectUserByProvinceAndCity" resultMap="BaseResultMap">  
    2.         SELECT *,  
    3.         (SELECT  COUNT(*) FROM user_user_t    
    4.         province_id=#{provinceId}     
    5.          AND   
    6.         city_id=#{cityId}) AS userCount  
    7.         FROM user_user_t  
    8.         province_id=#{provinceId}     
    9.          AND   
    10.         city_id=#{cityId}  
    11.         LIMIT #{pageIndex},#{pageSize}  
    12.     select>  

     

    User实体

    [java] view plain copy print?
      1. public class User {  
      2.     private Integer userId;  
      3.     private String userName;  
      4.     private Integer provinceId;  
      5.     private Integer cityId;  
      6.     private Integer userCount;//满足查询条件的用户数目,作为分页的依据  
      7.     } 

         

    1. 《转:http://blog.csdn.net/gisredevelopment/article/details/39084945》

    你可能感兴趣的:(springMVC+ajax分页查询)