在Kendo Grid中,要实现在添加行时可编辑但在编辑行时不可编辑的列,可以通过以下步骤实现:
columns: [
{ field: "name", title: "Name" },
{ field: "age", title: "Age", template: "#= editable ? kendo.toString(age, 'n0') : age #" },
// 其他列配置...
]
在上述代码中,我们使用了一个模板函数来定义"age"列。模板函数中的"editable"变量表示当前行的状态,如果为true,则表示当前行处于添加状态,该列可编辑;如果为false,则表示当前行处于编辑状态,该列不可编辑。
var dataSource = new kendo.data.DataSource({
data: [
{ name: "John", age: 25, editable: true },
{ name: "Jane", age: 30, editable: true },
// 其他行数据...
]
});
在上述代码中,我们为每一行数据添加了一个"editable"字段,并将其初始化为true,表示该行处于添加状态。
edit: function(e) {
var model = e.model;
model.set("editable", false); // 将当前行的editable字段设置为false,表示该行处于编辑状态
}
在上述代码中,我们在Grid的编辑事件中获取当前行的数据模型,并将其"editable"字段设置为false,表示该行处于编辑状态。
通过以上步骤,我们可以实现在添加行时可编辑但在编辑行时不可编辑的列。请注意,以上代码仅为示例,具体实现可能需要根据你的实际需求进行调整。
关于Kendo UI的更多信息和相关产品介绍,你可以参考腾讯云的Kendo UI产品文档:Kendo UI产品介绍。
没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云