How can I set and get columns of value / text columns in Kendo Grid

Question

I have a kendo grid that follows as
http://jsbin.com/uxumab/1/

It has a column ItemId, Qty, Price and Total (template). I want the Qty column to be edited and I want to change the overall value of the column when the Qty column changes. Finally, I want to get all the values ​​with the new changes using iteration through the grid.

Answer 1

Basically, the easiest way is to do this through MVVM kendo. Here is an example:

$(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#" } ] }); }); 

And the live version.