kendo ui中grid页面参数问题

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了kendo ui中grid页面参数问题相关的知识,希望对你有一定的参考价值。

kendo ui 中grid 算是最长用的控件之一,当使用分页效果时,我们要传递分页参数与自己定义的参数如:

 1 var dataSource = new kendo.data.DataSource({
 2             transport: {
 3                 read : {
 4                     url : "对应后台路径", 
 5                     contentType : "application/json",
 6                     type : "POST", 
 7                     dataType : "json"
 8                 },
 9                 parameterMap : function(options, operation) {
10                     if (operation == "read") {
11                         var parameter = {
12                             page : options.page,
13                             pageSize : options.pageSize,
14                             take : options.take,
15                             skip : options.skip
16                         };
17                         return kendo.stringify(parameter);
18                     }
19                 }
20             },
21             serverPaging: true,
22             pageSize: 20,
23             schema : {
24                 model : {
25                 id : "",
26                 },
27                 data: function (response) {
28                     return response.data;
29                 },
30                 total: function (response) {
31                     return response.total;
32                 }
33             },
34      });

对应的grid写法为:

$("#XXXX").kendoGrid({
        dataSource : dataSource,
        height: ,
        toolbar: kendo.template($("#template").html()),
        pageable: {
            refresh: true,
            pageSizes: true,
            buttonCount: 5,
            page: 1,
            pageSize: 20,
            pageSizes: [20, 50, 100, 500]
        },
        columns: [
            {field : "XX",        title :"XX"    },
            {field : "XX",        title :"XX"    },
            {field : "XX",        title :"XX"    },
            {field : "XX",        title :"XX"    },
            {field : "XX",        title :"XX"    },
        ],
        selectable: "row",
        sortable:true,
        resizable: true
    }).data("kendoGrid");

后台解析方法(JAVA后台)当:

    @Override
    public String XXX(String info) {
        JSONObject json = JSONObject.fromObject(info);
        PageBounds pageBounds = new PageBounds(Integer.parseInt(json.get("page").toString()), Integer.parseInt(json.get("pageSize").toString()));
        Map<String,Object> map = new HashMap<String, Object>();//注意这里定义了一个空的map没有赋值,是为了占位,如果需要可以赋值
        PageList<Map<String, Object>> list = (PageList<Map<String, Object>>) XXXDao.XXX(pageBounds,map);
        
        try {
            list = (PageList<Map<String, Object>>) XXXDao.XXX(pageBounds,map);
        } catch (Exception e) {
            logger.error("获取信息列表失败!  具体信息为:     " + e);
        }
        
        JSONObject jsonObj = new JSONObject();
        jsonObj.accumulate("data", JSONArray.fromObject(list));
        jsonObj.accumulate("total", list.getPaginator().getTotalCount());
        return jsonObj.toString();
    }

 

dao层impl代码
@Override public List
<Map<String,Object>> XXX(PageBounds pageBounds,Map<String,Object> map) { return sqlSessionTemplate.selectList("XXDao.XXX",map,pageBounds); }

此处特别需要注意的是selectList()内部传递的是三个参数,第一个大家都知道是dao层的路径,第二个是页面内的其他参数(比如你需要从前台传到后台的用户ID等等),第三个就是你解析的前台grid分页参数,如果当你页面不需要传递其他参数的时候,第二个参数需要用一个变量占位,这个变量可以是NULL,数字,或者一个空变量都可以。如果不穿参数的话会报错。无法解析。

 

以上是关于kendo ui中grid页面参数问题的主要内容,如果未能解决你的问题,请参考以下文章

如何在 Kendo UI Grid 中为不同的页面设置不同的页面大小

Kendo UI Grid - 显示行号

kendo UI使用基础介绍与问题整理——Grid问题/demo参数datafilter等

Kendo UI Grid Ajax 破坏成功

Kendo Ui Angular2 Grid 分页到第一页

Kendo Grid 和 ui-sref 向上取整数字