编辑网格时,如何按行禁用特定字段？

Question

我有一个带有数据的kendo网格和多个列(比如col 1,2和3).第1,2,3列需要能够根据彼此的值进行编辑(或防止编辑).这是特定于行的.

例如,如果第1列(日期)是<第2列(日期),则不允许编辑第3列.

我知道禁用或启用整个列很简单,但我的要求是特定于行的.因此,第1行可以启用第3列,第2行可以禁用第3列.

有什么想法吗？

Answer 1

我的建议是创建一个验证条件的编辑器功能.这当然有一个缺点,即一个临时解决方案,但......它的工作原理!

让我们有以下条目(DataSource的数据):

var entries = [
    { id:1, col1: new Date(2012, 11, 31), col2: new Date(2013, 0, 1), col3: "Yes" },
    { id:2, col1: new Date(2013, 0, 1), col2: new Date(2013, 0, 1), col3: "No" },
    { id:3, col1: new Date(2013, 0, 2), col2: new Date(2013, 0, 1), col3: "No" }
];

然后我将网格定义为:

var grid = $("#grid").kendoGrid({
    dataSource : {
        data    : entries,
        schema  : {
            model: {
                id    : "id",
                fields: {
                    col1: { type: "date"},
                    col2: { type: "date"},
                    col3: { editable: true }
                }
            }
        },
        pageSize: 3
    },
    columns    : [
        { field: "col1", title: "Col1", format: "{0:yyyy-MM-dd}" },
        { field: "col2", title: "Col2", format: "{0:yyyy-MM-dd}" },
        { field: "col3", title: "Edit?", editor: checkAndEdit }
    ],
    editable   : "incell",
    navigatable: true,
    pageable   : true
}).data("kendoGrid");

where col1和col2are date col3是一个可以编辑的字符串,当且仅当 col1它小于col2.

我将checkAndEdit函数定义如下:

function checkAndEdit(container, options) {
    if (options.model.col1 < options.model.col2) {
        $('<input data-bind="value:' + options.field + '" ' +
                'data-format="' + options.format + '" ' +
                'class="k-input k-textbox"/>')
                .appendTo(container);
    } else {
        grid.closeCell(container);
    }
}

我在哪里生成相应的input字段,如果col1< col2并以其他方式调用closeCell退出edit模式.

你可以看到它在这里运行