javascript - Kendo Grid 的動態預設值

我想在我的 Kendo Grid 中設置一個 自動遞增 欄位。這個欄位不是伺服器端自動遞增，因為我希望使用者能看到這個值並且可以更改它。

我目前的解決方案是在 Create 按鈕上添加一個 click 屬性，並循環遍歷行以找到最高值並將其遞增。

但是我如何將這個值插入到新創建的行中呢？Click 事件發生在新行創建之前。

所以有兩個可能的解決方案：

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);
}

答案＃1

你可以使用 Grid 的 edit 事件將你的新 generatedId 值添加到新的 Grid model 中。

這是他們文件中的一些說明：

編輯

當使用者編輯或建立資料項目時觸發。

• e.container jQuery，編輯容器元素的 jQuery 物件，該元素包裹著編輯介面。
• e.model kendo.data.Model，即將被編輯的資料項目。使用它的 isNew 方法來檢查該資料項目是新的（創建的）還是已編輯的。
• e.sender kendo.ui.Grid，觸發事件的小工具實例。

我想你的點擊有類似這樣的東西

//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);
}

注意：您的 schema 模型的欄位必須設置屬性 editable: true，以便我們能夠使用 set 方法更改模型欄位的值。此外，如果您的欄位 schema 有驗證要求，您需要將其移除。

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

範例

答案＃2

我能在資料來源的架構中放置一個函數來處理這個。

schema: {
    model: {
        id: "id",
        fields: {
            currencyType: { defaultValue: getDefaultCurrency },
            invoiceDate: { type: "date" }
        }
    }
}

    function getDefaultCurrency() {
        return _.find(vm.currencyTypes, { id: vm.currencyId });
    };