Datatable+Springmvc+mybatis(分页+排序+搜索)_Jquery

Datatable+Springmvc+mybatis(分页+排序+搜索)_Jquery

一、简介

通过Jqury的Datatable插件,构造数据列表,并且增加或者隐藏相应的列,已达到数据显示要求。同时, jQuery Datatable 强大的功能支持:排序,分页,搜索等。

二、前台分页

1、Datatable参数讲解

 
订单号 校区 下单时间 发单人 带客 订单状态 订单类型 金额 操作
 

2、根据Datatable需要的Json数据格式,提供DatatableVO实体类。

 1 public class DataTableResultVO{
 2     private int draw;//请求的次数
 3     private int recordsTotal;//返回的记录总数
 4     private int recordsFiltered; //过滤后的数据总数
 5     private List data; // 显示到页面的数据
 6 
 7     public DataTableResultVO() {}
 8 
 9     public int getDraw() {
10         return draw;
11     }
12 
13     public void setDraw(int draw) {
14         this.draw = draw;
15     }
16 
17     public int getRecordsTotal() {
18         return recordsTotal;
19     }
20 
21     public void setRecordsTotal(int recordsTotal) {
22         this.recordsTotal = recordsTotal;
23     }
24 
25     public int getRecordsFiltered() {
26         return recordsFiltered;
27     }
28 
29     public void setRecordsFiltered(int recordsFiltered) {
30         this.recordsFiltered = recordsFiltered;
31     }
32 
33     public List getData() {
34         return data;
35     }
36 
37     public void setData(List data) {
38         this.data = data;
39     }
40 
41     @Override
42     public String toString() {
43         return "DataTableResultVO{" +
44                 "draw=" + draw +
45                 ", recordsTotal=" + recordsTotal +
46                 ", recordsFiltered=" + recordsFiltered +
47                 ", data=" + data +
48                 '}';
49     }
50 }

3、springmvc构造Datable需要的json数据格式

    @RequestMapping(value = "/Admin/loadFirms.do",method = {RequestMethod.POST})
    @ResponseBody
    public String loadFirms(HttpServletRequest request, HttpServletResponse response){
        try {
            List firms=firmService.loadFirmsToAdmin();
            DataTableResultVO result=new DataTableResultVO<>();
            result.setData(firms);//data参数。
            result.setRecordsTotal(firms.size());//数据的条数
            result.setRecordsFiltered(firms.size());//过滤后数据的条数
            return JSONObject.fromObject(result).toString();
        }catch (Exception e){
            e.printStackTrace();
        }
        return null;
    }

4、利用mybatis实现Service层与Dao层

//FirmServiceImpl、获取数据列表  
public List loadFirmsToAdmin()throws Exception{
        return firmDao.selectFirmsByTableParams();
    }

//FirmDao接口
 public Firm selectFirmDetailToAdmin(String firmId);

//FirmDaoxml


   
 
 

 
 
        
        
        
        
        
        
        
        
        
        
        
        
        
            
            
            
            
            
            
            
            
            
            
            
            
        
        
            
            
            
            
            
            
            
        
    

三、后台分页

原理跟前台类似,只是数据分页、排序、查询在后台完成。

1、ajax请求重要参数(start、length、search[value])

  start: 其实记录位置

  length: 页面显示数量

  order[0][column]: 因为是二维的表格,因此只有一维需要排序,所以 order 的下标未0. 该属性表示第几列需要排序。

  order[0][dir]: 排序方式 ASC | DESC

  search[value]: search 输入框中的值

2、Springmvc获取参数

 1    int pageSize = 10;
 2    int startRecord = 0;
 3     //分页的数据条数
 4     String size = request.getParameter("length");
 5     if (!"".equals(size) && size != null) {
 6         pageSize = Integer.parseInt(size);
 7     }
 8     //分页的当前位置
 9     String currentRecord = request.getParameter("start");
10     if (!"".equals(currentRecord) && currentRecord != null) {
11         startRecord = Integer.parseInt(currentRecord);
12     }
13     //用于排序
14     String sortOrder = request.getParameter("order[0][column]");
15     String sortDir = request.getParameter("order[0][dir]");
16     System.out.println("sortOrder: " + sortOrder);
17     System.out.println("sortDir: " + sortDir);
18              
19     // 用于搜索
20     String searchValue = request.getParameter("search[value]");     

3、核心思想:组装sql,例如select * from firm where  1=1 order by sortOrder sortDir limit start,length。

4、dao层实现,利用servlet+jdbc对后台分页进行详细说明。

参考:http://www.tuicool.com/articles/NBBnum

参考:http://blog.csdn.net/tomcat_2014/article/details/50177645

四、致敬语

刚开始通过写博客来做学习笔记,若有什么不足请多多指正,谢谢!

posted @ 2017-01-05 20:18 邱勇Aries 阅读( ...) 评论( ...) 编辑 收藏

你可能感兴趣的:(Datatable+Springmvc+mybatis(分页+排序+搜索)_Jquery)