如何限制KendoUI Grid的行数？

Question

我有一个简单的kendoUI网格，应该只有最多只有5行。是否有可用于限制行的配置属性，还是应该编写一些简单的自定义逻辑来检查我的数据源并防止添加多于5行？

Answer 1

鉴于以下kendoGrid定义：

var grid = $("#grid").kendoGrid({ 
    dataSource:stocksDataSource, 
    columns :[ 
     { field:"col1", title:"Column 1" }, 
     { field:"col2", title:"Column 2" }, 
     { field:"col3", title:"Column 3" } 
    ], 
    toolbar :[ 
     { name  :"create", className :"k-grid-add2" } 
    ], 
    editable :true 
}).data("kendoGrid"); 

我在工具栏中添加了一个create按钮但是将其className重新定义为k-grid-add2。然后，我对这个按钮添加陷阱click事件如下：

$(".k-grid-add2", grid.element).bind("click", function (ev) { 
    console.log("adding!"); 
    if (grid.dataSource.data().length < 5) { 
     grid.addRow(); 
    } else { 
     alert("Too many, sorry!") 
    } 
}); 

当我检查的行数，如果有小于5然后我调用grid.addRow()否则我警告用户有太多的行。

Answer 2

如果你的意思是页面大小应限制在5行，然后就可以设置对数据源的pageSize选项：

$("#grid").kendoGrid({ 
    dataSource: { 
     pageSize: 5 
    } 
}); 

http://docs.kendoui.com/api/web/grid#pageablepagesize-number