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

kendoui

浏览: 28103 次
性别:
来自: 上海

最近访客更多访客>>

xjsimon

guyu152

zlwei666

荒古小幽

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

kendoui grid

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

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

前端：demo.js

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: "公司成立日期"

            }

        ]

    });
 
});

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

前端: demo.ftl

<!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

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

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

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

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

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 );

    }
}

1
顶

1
踩

分享到：

http://www.kendoui.io 更新到2015.2.702最 ... | KendoUI 官方示例之 Grid / Column resizin ...

2015-05-24 22:43
浏览 4866
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

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

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

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

评论

发表评论

相关推荐

最近访客更多访客>>