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

同文地址： 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 );
    }
}