Kendo Grid的动态默认值 [英] Dynamic default value for Kendo Grid

问题描述

我想在我的Kendo Grid中使用自动增量列。此字段不是服务器端自动增量，因为我希望用户看到该值并能够更改它。

I want an auto increment column in my Kendo Grid. This field isn't server side auto increment, because I want the user to see the value and be able to change it.

我当前的解决方案是添加点击属性到创建按钮并循环遍历行以找到最高值并增加它。

My current solution is to add a click attribute to Create button and loop over rows to find the highest value and increment it.

但是如何在新创建的行中插入此值？ 点击事件在创建新行之前发生。

But how can I insert this value inside the newly created row? Click event happens before the new row is created.

因此有两种可能的解决方案：

So there is two possible solution:

1. 将变量作为默认值并在我的JS代码中更新。


2. 以某种方式访问​​新创建的行，并且更新价值。

这是我的JS代码：

function createClick(id) {
    var grid = $("#" + id).data('kendoGrid');
    var highestRadif = 0;
    grid.tbody.find('>tr').each(function () {
        var dataItem = grid.dataItem(this);
        var radif = dataItem.SRadifReqR;
        highestRadif = highestRadif < radif ? radif : highestRadif;
    })
    alert(++highestRadif);
}

推荐答案

你可以使用Grid的编辑事件，将新的 generatedId 值添加到新Grid的模型。

You can use Grid's edit event to add your new generatedId value to new Grid's model.

这是他们的 文档 ：

This is some explanation from their documentation:

修改

在用户编辑或创建数据项时触发。

fired when the user edits or creates a data item.

• e.container jQuery ，编辑容器元素的jQuery对象，它包装了编辑用户界面。


• e.model kendo.data.Model ，即将编辑的数据项。使用isNew方法检查数据项是否为新的
  （已创建）或未创建（已编辑）。


• e.sender kendo .ui.Grid ，触发事件的小部件实例。

• e.container jQuery, jQuery object of the edit container element, which wraps the editing UI.
• e.model kendo.data.Model, The data item which is going to be edited. Use its isNew method to check if the data item is new (created) or not (edited).
• e.sender kendo.ui.Grid, The widget instance which fired the event.

我想你的点击有这样的东西

I suppose your click have something like this

//generate id code
vm.newId = ++highestRadif; // we need to store generated Id
grid.addRow();

然后编辑活动

edit: function(e) {
    var model = e.model; // access edited/newly added model
    // model is observable object, use set method to trigger change event
    model.set("id", vm.newId);
}

注意：您的架构模型的字段必须设置属性 editable：true ，因为我们可以使用 set 方法更改模型字段值。此外，如果您的字段架构需要验证，则需要将其删除。

Note: Your schema model's field must set property editable: true, due to enable us to change model field value using set method. Also if your field schema have validation required, you need to remove it.

model: {
    id: "ProductID",
    fields: {
        ProductID: { editable: true, nullable: true },
    }
}

示例

这篇关于Kendo Grid的动态默认值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！