Kendo UI:在更改另一列中的值时更新一列数据 [英] Kendo UI: Update one columns data on changing value in another column

问题描述

场景 我有一个产品详细信息网格，在编辑"中打开了一个包含该记录详细信息的弹出窗口.除数量字段外，所有字段均为只读.因此，当我增加或减少数量时，价格栏应根据值反映出来. 因此，如果数量1为10，那么当我将数量增加到2时，它应该反映为20.

Scenario I am having a grid of product details which on Edit opens up a pop-up comprising of that record details. All fields are readonly except the quantity field. Hence, when I increase or decrease the quantity the price column should reflected based on the value. So if quantity of 1 is 10 then when I increase the quantity to 2 it should be reflected to 20.

问题 1)我已经研究了编辑器方法，我必须在数量列上使用相同的方法吗?

Questions 1) I've studied the editor method a bit, I'll have to use the same method on the quantity column right??

2)如何获取价格列的值并更新其值?是否有诸如编辑器之类的内置方法?我该怎么办?

2) How shall I grab the value of the price column and update its value? are there any built in methods like the editor?? How shall I go about??

以下是我准备的JS小提琴. http://jsbin.com/ugeref/3/edit

Following is the JS fiddle which I have prepared. http://jsbin.com/ugeref/3/edit

谢谢！

- 哈迪克

推荐答案

将DataSource定义为:

var dataSource = new kendo.data.DataSource({
    data  : data,
    schema: {
        model: {
            id    : "Id",
            fields: {
                productName: { editable: false},
                quantity   : { editable: true, type : "number" },
                price      : { editable: false, type : "number" },
                total      : { editable: false, type : "number" }
            }
        }
    }
});

应在其中添加quantity乘以price的total字段的位置. 注意:此外，我还定义了不同字段的类型，以使KendoUI知道它们是数字并生成正确的小部件.

Where you should add a total field that is quantity times price. NOTE: In addition, I've defined the type of the different fields to let KendoUI know that are number and generate the correct widgets.

然后，将grid定义为:

$("#grid").kendoGrid({
    dataSource: dataSource,
    pageable  : true,
    height    : 400,
    toolbar   : ["create"],
    columns   : [
        { field: "productName", title: "Product Name" },
        { field: "quantity", title: "Quantity", format: "{0:c}"},
        { field: "total", title: "Total", template: "#= quantity * price #", width: "150px" },
        { command: ["edit", "destroy"], title: " " }
    ],
    editable  : "popup"
});

我在其中添加了Total列的地方，该列使用的模板是quantity * price的结果.

Where I added a Total column that uses a template that is the result of quantity * price.

每次更新quantity时，total都会得到updated.

Each time that you update quantity, total will get updated.

在此处

这篇关于Kendo UI:在更改另一列中的值时更新一列数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！