考虑我有一个剑道网格,如下所示
http://jsbin.com/uxumab/1/
它有 ItemId、Qty、Price 和 Total(template) 列。我想让 Qty 列可编辑,并希望通过 Qty 列的更改来更改总列值。最后,我想通过网格迭代检索所有具有新更改的值。
考虑我有一个剑道网格,如下所示
http://jsbin.com/uxumab/1/
它有 ItemId、Qty、Price 和 Total(template) 列。我想让 Qty 列可编辑,并希望通过 Qty 列的更改来更改总列值。最后,我想通过网格迭代检索所有具有新更改的值。
基本上最简单的方法是通过 kendo 的 MVVM 来做到这一点。这是一个例子:
$(document).ready(function () {
var gridData = [
{ ItemId: "1001", Qty: 2, price: 200 }
, { ItemId: "1002", Qty: 1, price: 100 }
, { ItemId: "1003", Qty: 1, price: 150 }
];
$("#grid").kendoGrid({
dataSource: gridData
, selectable: "row",
dataBound:function(){
grid = this;
grid.tbody.find('tr').each(function(){
var item = grid.dataItem(this);
kendo.bind(this,item);
})
}
, columns: [
{ field: "ItemId" }
, { field: "Qty" }
, { field: "price" }
, { title: "Quantity", width: "200", template: '<input data-role="numerictextbox" data-bind="value:Qty" data-max-value="100"/>' } , {
title: "Total"
, template: "#=Qty*price#"
}
]
});
});
和现场版。