欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

KendoUI Grid 前后端(Java) 完整案例之查询翻页 kendouigrid

程序员文章站 2024-03-24 10:46:52
...

同文地址: http://kendoui.io/blog/38.html

 

KendoUI Grid 前后端(Java 代码参考)(以下案例基于springmvc + freemarker + MyBatis + RequireJS )

前端:demo.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
require(['lib/domReady!'],     function () {
 
    kendo.culture("zh-CN");
 
    $("#grid").kendoGrid({
        dataSource: {
            transport: {
                read: {
                    url: CONTEXT_PATH + "/api/teedm01",
                    dataType: "json"
                }
            },
            pageSize: 10,
            serverPaging: true,
            serverSorting: true,
            serverFiltering: true,
            schema: {
                data: function (d) { return d.data; },
                total: function (d) { return d.count; }
            }
        },
        height: 300,
        selectable: "multiple cell",
        pageable: true,
        sortable: true,
        columns: [
            {
                field: "companyCode",
                title: "公司代码"
            },
            {
                field: "companyName",
                title: "公司名称"
            },
            {
                field: "companyTel",
                title: "公司电话"
            },
            {
                field: "companyAddr",
                title: "公司地址"
            },
            {
                field: "countryCode",
                title: "国家代码"
            },
            {
                field: "companyDate",
                title: "公司成立日期"
            }
        ]
    });
 
});

 

1
<span style="font-family: 微软雅黑, 'Microsoft YaHei';"><br></span>

前端: demo.ftl

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head>
    <title>Grid单表展示</title>
    <#import "spring.ftl" as spring />
    <link rel="stylesheet" type="text/css" href="<@spring.url '/avatar/plugins/kendoui/styles/kendo.common.min.css'/>"/>
<link rel="stylesheet" type="text/css" href="<@spring.url '/avatar/plugins/kendoui/styles/kendo.blueopal.min.css'/>"/>
<link rel="stylesheet" type="text/css" href="<@spring.url '/avatar/styles/default/css/style.css'/>">
<link rel="stylesheet" type="text/css" href="<@spring.url '/avatar/styles/base.css'/>">
 
</head>
<body>
    <div id="example" style="margin: 0 auto ;width: 1000px;padding: 10px;">
        <div id="grid"></div>
    </div>
 
    <script data-main="<@spring.url '/avatar/demo/grid/basic/app.js'/>" src="<@spring.url '/avatar/js/lib/require.js'/>" ></script>
</body>
</html>

Java后端控制器:DemoController.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
 
@Controller
@RequestMapping("/grid")
public class DemoController{
 
   @RequestMapping(value="/basic", method=RequestMethod.GET)
   public String show(ModelMap model) {
      return "demo.ftl";
   }
}

 

Java后端Rest接口:DemoApi.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import com.sheeyi.avatar.common.entity.PageResultEntity;
import com.sheeyi.avatar.common.entity.ResultEntity;
import com.sheeyi.avatar.core.anotation.mapping.*;
import com.sheeyi.avatar.core.base.BaseResource;
import com.sheeyi.avatar.core.dao.mapper.MapperExample;
import com.sheeyi.avatar.core.web.Query;
import com.sheeyi.avatar.demo.grid.model.Teedm01;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.context.request.WebRequest;
 
import java.util.Map;
 
@RestController
@RequestMapping("/api/teedm01")
public class Teedm01Api extends BaseResource<Teedm01> {
 
    @GetManyRequestMapping
    public PageResultEntity<Teedm01> selectByMapper( @RequestParam Map<String,Object> params ){
 
        int offset = Query.getOffset( params );
        int limit = Query.getLimit(params);
 
        return super.selectByMap( params, offset, limit);
    }
 
    @CountRequestMapping
    private ResponseEntity count( WebRequest webRequest ){
 
        return super.countByExample(new MapperExample());
    }
 
    @GetOneRequestMapping
    public Teedm01 selectByKey( @PathVariable("id") String id  ){
        return super.selectByKey( id );
    }
 
    @PutRequestMapping
    public ResponseEntity<ResultEntity> update( @RequestBody Teedm01 t ){
        return super.update( t );
    }
 
    @PostRequestMapping
    public ResponseEntity<ResultEntity> insert( Teedm01 t ){
 
        return super.insert( t );
    }
 
    @DeleteRequestMapping
    public ResponseEntity<ResultEntity> delete( @PathVariable("id") String id ){
 
        return super.delete( id );
    }
}

 

Java后端工具类:Query.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
import org.springframework.util.StringUtils;
 
import java.util.Map;
 
public class Query {
 
    public static final String OFFSEET = "skip";
 
    public static final String LIMIT = "pageSize";
 
    public static final int DEFAULT_OFFSET = 0;
 
    public static final int DEFAULT_LIMIT = 10;
 
    public static int getOffset( Map params ){
 
        Object offset = params.get( OFFSEET );
        if(!StringUtils.isEmpty( offset )){
 
            try {
                return Integer.parseInt(offset.toString());
            }catch ( NumberFormatException e ){
                return DEFAULT_OFFSET;
            }
        }
        return DEFAULT_OFFSET;
    }
 
    public static int getLimit( Map params ){
 
        Object limit = params.get( LIMIT );
        if(!StringUtils.isEmpty( limit )){
 
            try {
                return Integer.parseInt(limit.toString());
            }catch ( NumberFormatException e ){
                return DEFAULT_LIMIT;
            }
        }
        return DEFAULT_LIMIT;
    }
 
}

 

Java后端Rest集成基类:BaseResource.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
import com.sheeyi.avatar.common.ResultStatus;
import com.sheeyi.avatar.common.entity.PageResultEntity;
import com.sheeyi.avatar.common.entity.ResultEntity;
import com.sheeyi.avatar.common.entity.ResultEntityBuilder;
import com.sheeyi.avatar.core.dao.mapper.MapperExample;
import org.apache.ibatis.session.RowBounds;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.web.context.request.WebRequest;
 
import java.util.HashMap;
import java.util.Iterator;
import java.util.List;
import java.util.Map;
 
public abstract class BaseResource<T> {
 
    @Autowired
    protected BaseService<T> baseService;
 
    public PageResultEntity<T> selectByExample(MapperExample example, int skip, int pageSize){
 
        RowBounds rowBounds = new RowBounds(skip, pageSize);
 
        List<T> ts = baseService.selectByExample(example, rowBounds);
        int count = baseService.countByExample(example);
 
        PageResultEntity<T> pageResultEntity = new PageResultEntity<T>();
        pageResultEntity.setData( ts );
        pageResultEntity.setCount( count );
 
        return pageResultEntity;
    }
 
    public PageResultEntity<T> selectByMap(Map<String, Object> params, int skip, int pageSize){
 
        PageResultEntity<T> pageResultEntity = getPageResultEntity(params, skip, pageSize);
        return pageResultEntity;
    }
 
    protected PageResultEntity<T> getPageResultEntity(Map<String, Object> params, int skip, int pageSize) {
        RowBounds rowBounds = new RowBounds(skip, pageSize);
 
        List<T> ts = baseService.selectByMap(params, rowBounds);
        int count = baseService.countByMap(params);
 
        PageResultEntity<T> pageResultEntity = new PageResultEntity<T>();
        pageResultEntity.setData( ts );
        pageResultEntity.setCount( count );
        return pageResultEntity;
    }
 
    public PageResultEntity<T> select(WebRequest request,int skip, int pageSize  ) {
        HashMap params = new HashMap();
        Iterator<String> it = request.getParameterNames();
        while (it.hasNext())
        {
            String key = it.next();
            if(!key.equals("take")&&!key.equals("page")&&!key.equals("pageSize")&&!key.equals("skip"))
                params.put(key,request.getParameter(key));
        }
 
        PageResultEntity<T> pageResultEntity = getPageResultEntity(params, skip, pageSize);
        return pageResultEntity;
    }
 
 
    public ResponseEntity<ResultEntity> countByExample(MapperExample example){
 
        int count = baseService.countByExample(example);
        return new ResponseEntity<ResultEntity>(ResultEntityBuilder.build().result( String.valueOf( count ) ), HttpStatus.OK);
    }
 
    public T selectByKey( String id  ){
        T t =baseService.selectByKey( id );
        return t;
    }
 
    public ResponseEntity<ResultEntity> update( T t ){
        baseService.updateByKey( t );
        ResultEntity resultEntity = ResultEntityBuilder.build().status(ResultStatus.SUCCESS).msg( "更新操作成功." );
        ResponseEntity<ResultEntity> responseEntity = new ResponseEntity<ResultEntity>( resultEntity, HttpStatus.OK);
        return responseEntity;
    }
 
    public ResponseEntity<ResultEntity> insert( T t ){
        baseService.insert(t);
 
        ResultEntity resultEntity = ResultEntityBuilder.build().status(ResultStatus.SUCCESS).msg( "新增操作成功." );
        ResponseEntity<ResultEntity> responseEntity = new ResponseEntity<ResultEntity>(resultEntity, HttpStatus.OK);
        return responseEntity;
    }
 
    public ResponseEntity<ResultEntity> insertPatch( List<T> t ){
        baseService.insertPatch(t);
 
        ResultEntity resultEntity = ResultEntityBuilder.build().status(ResultStatus.SUCCESS).msg( "批量新增操作成功." );
        ResponseEntity<ResultEntity> responseEntity = new ResponseEntity<ResultEntity>(resultEntity, HttpStatus.OK);
        return responseEntity;
    }
 
    public ResponseEntity<ResultEntity> delete( String id ){
 
        baseService.deleteByKey(id);
 
        ResultEntity resultEntity = ResultEntityBuilder.build().status(ResultStatus.SUCCESS).msg( "删除操作成功." );
        ResponseEntity<ResultEntity> responseEntity = new ResponseEntity<ResultEntity>( resultEntity, HttpStatus.OK);
        return responseEntity;
    }
}

 

Java后端业务逻辑Service:DemoService.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
import com.sheeyi.avatar.core.base.BaseService;
import com.sheeyi.avatar.demo.grid.model.Teedm01;
import com.sheeyi.avatar.logging.AvatarLogger;
import com.sheeyi.avatar.logging.AvatarLoggerFactory;
import org.apache.ibatis.session.RowBounds;
import org.springframework.cache.annotation.CacheEvict;
import org.springframework.cache.annotation.CachePut;
import org.springframework.cache.annotation.Cacheable;
import org.springframework.stereotype.Service;
 
import java.util.List;
import java.util.Map;
 
@Service
public class DemoService extends BaseService<Demo> {
 
    @Override
    public Demo selectByKey( Object key ){
 
 
        return super.selectByKey( key);
    }
 
    @Override
    public  List<Demo> selectByMap(Map<String, Object> params, RowBounds rowBounds)
    {
        return super.selectByMap(params, rowBounds);
    }
 
    @Override
    public int updateByKey( Demo teedm01 )
    {
        return super.updateByKey( teedm01 );
    }
 
    @Override
    public int deleteByKey(Object key){
 
        return super.deleteByKey( key );
    }
}

 

相关标签: kendoui grid