Kendo UI + Mybatis + MSSQL 을 이용한 Grid 페이징 처리

Kendo UI 의 Grid를 Server Side 페이징 처리를 해보자
중요한 부분을 요약하면 Kendo UI Grid에서 설정을 한 후 Client에서 skip, page, take, pageSize를 보내오면 Server에서는 total, data를 보내면 된다. (page는 0부터 시작이 아니라 1부터 시작이다)
MSSQL에서는 2012버전부터 페이징 처리를 위한 문법을 제공한다

Script 파일

var listDataSource = new kendo.data.DataSource({
    transport: {
...
        read: function(options) {
            $.ajax({
              url: "<%=applicationBasePath%>/api/getActionList.do",
              contentType: 'application/json',
              dataType: "json",
              type: 'POST',
              data: JSON.stringify(options.data),
              success: function(result) {
                  options.success(result);
              },
              error: function(result) {
                options.error(result);
              }
            });
        },
    },
...
    schema: {
...
        data: function(response) {
            return JSON.parse(response.data);
        },
        total: function(response) {
            return response.total;
        }
    },
    pageSize: 30, //Server Side Paging 처리를 위하여
    serverPaging: true, //Server Side Paging 처리를 위하여
...
});

var listGrid = $("#listGrid").kendoGrid({
    dataSource: listDataSource,
...    
    pageable: true, //Server Side Paging 처리를 위하여
    sortable: false, 
    groupable: false, 
    filterable: false, 
...
});

전달 하는 모델 파일

public class RestAPIMessage {

   private String state;
   private String message;
   private String data;

   //Paging / Filter / Sort 관련
   private int take;
   private int skip;
   private int page;
   private int pageSize;
   private String filter;

   private int total;
   //
   
   public RestAPIMessage() {
      state = "success";
      message = "";
      data = "";
   }
   
   public String getState() {
      return state;
   }
   public void setState(String state) {
      this.state = state;
   }
   public String getMessage() {
      return message;
   }
   public void setMessage(String message) {
      this.message = message;
   }
   public String getData() {
      return data;
   }
   public void setData(String data) {
      this.data = data;
   }

   public int getTake() {
      return take;
   }

   public void setTake(int take) {
      this.take = take;
   }

   public int getSkip() {
      return skip;
   }

   public void setSkip(int skip) {
      this.skip = skip;
   }

   public int getPage() {
      return page;
   }

   public void setPage(int page) {
      this.page = page;
   }

   public int getPageSize() {
      return pageSize;
   }

   public void setPageSize(int pageSize) {
      this.pageSize = pageSize;
   }

   public String getFilter() {
      return filter;
   }

   public void setFilter(String filter) {
      this.filter = filter;
   }

   public int getTotal() {
      return total;
   }

   public void setTotal(int total) {
      this.total = total;
   }

}

Controller 파일

@RequestMapping(value = "/getActionList.do", method = RequestMethod.POST, produces = "application/text; charset=UTF-8")
@ResponseStatus(value = HttpStatus.OK)
public String getActionList(@RequestBody String data) {

   RestAPIMessage returnMessage = new RestAPIMessage();
   returnMessage.setState("success");

   Gson gson = new Gson();

   try {
      RestAPIMessage receiveMessage = gson.fromJson(data, RestAPIMessage.class);

      //Paging 처리를 위하여 Client에서 받은 것
      int skip = receiveMessage.getSkip();
      int page = receiveMessage.getPage();
      int take = receiveMessage.getTake();
      int pageSize = receiveMessage.getPageSize();
      //

      //Paging 처리를 위하여 Client로 보낼 것
      int total = applicationService.getActionTotal();
      returnMessage.setTotal(total);
      //

      List<FRMMAction> frmmActionList = applicationService.getActionList(page, pageSize);
      returnMessage.setData(gson.toJson(frmmActionList));
   }
   catch (Exception e) {
      returnMessage.setState("failure");
      returnMessage.setMessage("실패");
      e.printStackTrace();
   }

   return gson.toJson(returnMessage);
}

Service 파일

public List<FRMMAction> getActionList(int page, int pageSize) {
    Map<String, Integer> params = new HashMap<String, Integer>();
    params.put("page", page);
    params.put("pageSize", pageSize);
    return frmmMapper.selectActionList(params);
}

public int getActionTotal() {
    int returnValue = 0;
    int[] result = frmmMapper.selectActionTotal();
    if(result != null && result.length > 0) {
        returnValue = result[0];
    }

    return returnValue;
}

Mapper 파일

<select id="selectActionList" parameterType="map" resultType="com.ariulsoft.frmm.model.FRMMAction" >
   SELECT guid, materialCode, lotNo, type, qty, createDate
     FROM Action
        ORDER BY createDate DESC
   OFFSET (#{page}-1) * #{pageSize} ROW
    FETCH NEXT #{pageSize} ROW ONLY
</select>

<select id="selectActionTotal" resultType="int" >
   SELECT COUNT(*)
     FROM Action
</select>