编辑网格时,如何按行禁用特定字段? [英] When editing a grid, how do I disable specific fields by row?
问题描述
我有一个剑道网格,其中包含数据和多列(比如第 1、2 和 3 列).第 1、2、3 列需要能够根据彼此的值进行编辑(或阻止编辑).这是特定于行的.
I have a kendo grid with data in it and multiple columns (say col 1, 2, and 3). Columns 1, 2, 3 need to be able to be edited (or preventing editing) based off the values of each other. This is row specific.
例如,如果第 1 列(日期)是 <第 2 列(日期),则不允许编辑第 3 列.
For instance, if column 1 (date) is < column 2 (date) then column 3 is not allowed to be edited.
我知道禁用或启用整列很简单,但我的要求是特定于行的.所以第 1 行可以启用第 3 列,第 2 行可以禁用第 3 列.
I know it's simple enough to disable or enable an entire column but my requirements are row specific. So row 1 could have column 3 enabled and row 2 could have column 3 disabled.
有什么想法吗?
推荐答案
我的建议是创建一个编辑器函数来验证条件.这当然有一个临时解决方案的缺点,但......它有效!
My suggestion is creating an editor function that validates the condition. This of course has the disadvantage that is an ad-hoc solution but ... it works!
让我们有以下条目(数据源的数据):
Lets have the following entries (data of the 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");
其中col1
和col2
是日期,col3
是可以编辑的字符串,当且仅当col1
小于 col2
.
Where col1
and col2
are dates and col3
is a string that can be edited if and only if col1
is less than col2
.
我定义了 checkAndEdit
函数如下:
I define checkAndEdit
function as follow:
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);
}
}
如果 col1
< 生成相应的 input
字段col2
否则调用 closeCell
以退出 edit
模式.
Where I generate the corresponding input
field if col1
< col2
and otherwise invoke closeCell
for exiting edit
mode.
你可以看到它在这里
这篇关于编辑网格时,如何按行禁用特定字段?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!