【问题标题】:How can I limit the number of rows that a KendoUI Grid can have?如何限制 KendoUI Grid 可以拥有的行数?
【发布时间】:2012-11-26 10:11:09
【问题描述】:

我有一个简单的剑道 UI 网格,它应该最多只有 5 行。是否有任何配置属性可以用来限制行,或者我应该编写一些简单的自定义逻辑来检查我的数据源并防止添加超过 5 行?

【问题讨论】:

    标签: html kendo-ui kendo-asp.net-mvc


    【解决方案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(),否则我会提醒用户行数过多。

    【讨论】:

    • 返回假; //如果是批处理模式,则在 if else 之后
    【解决方案2】:

    如果您的意思是将页面大小限制为 5 行,那么您可以在数据源上设置 pageSize 选项:

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

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

    【讨论】:

    • 不,我实际上希望网格始终只有 5 行并想到它,我想这样的事情应该用我自己的数据源逻辑来完成 :) 但是谢谢。 ..!
    • 我只是想知道我是否真的应该使用这一行:if($("#divProductsGrid").data("kendoGrid").dataSource.data().length
    • 不,没有这样的选项(afaik)。
    • 是可以添加行的网格吗?如果是这样,您的解决方案不会阻止添加行,而是检查行数是否小于 5。解决方案类似,但如果行数少于 5,您需要拦截 add 事件和 grid.addRow。跨度>
    • @Sandeep 你说得对,那么应该在添加数据源之前完成。您的数据源是什么样的?是数组、列表还是其他?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-04-11
    • 2014-10-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多