I'm trying to calculate a "Total" column while the user types the quantity through a input inside the template of the grid. I've been stuck here for a while now.
var
ds =
new
kendo.data.DataSource({
type:
"aspnetmvc-ajax"
,
transport: {
read:
"Home/Products_Read"
},
schema: {
data:
"data"
,
total:
"total"
,
model: {
id:
"products"
,
fields: {
Code: { editable:
false
},
Number: { editable:
false
},
Name: { editable:
false
},
Supplier: { editable:
false
},
Price: { editable:
false
, type:
"number"
, format:
"{0:n}"
},
UnitStock: { editable:
false
},
UnitBasic: { editable:
false
},
Quantity: { editable:
true
, type:
"number"
},
Total: { editable:
true
, type:
"number"
, format:
"{0:n}"
}
}
}
},
pageSize: 15,
serverPaging:
true
,
serverFiltering:
true
,
serverSorting:
true
});
var
gridResult = $(
"#grid"
).kendoGrid({
dataSource: ds,
selectable:
"row"
,
sortable:
true
,
pageable:
true
,
columns: [
{ field:
"Code"
, title:
"Code"
, width:
"100px"
},
{ field:
"Number"
, title:
"Number"
, width:
"100px"
},
{ field:
"Name"
, title:
"Name"
},
{ field:
"Supplier"
, title:
"Supplier"
, width:
"100px"
},
{ field:
"Price"
, title:
"Price"
, width:
"100px"
, format:
"{0:n}"
},
{ field:
"UnitStock"
, title:
"Unit"
, width:
"100px"
},
{ field:
"Quantity"
, title:
"Quantity"
, width:
"100px"
, template:
'<input class="someInput" name=#=Code# value=#=Quantity# />'
},
{ field:
"Total"
, title:
"Total"
, width:
"100px"
, template:
'#=Price*Quantity#'
},
]
});
$(
'.someInput'
).on(
'change'
,
function
() {
for
(
var
i = 0; i < gridResult.dataSource.data().length; i++) {
if
(parseInt(gridResult.dataSource.data()[i].Code) == parseInt($(
this
).attr(
'name'
))) {
gridResult.dataSource.data()[i].Quantity.Set($(
this
).val());
}
}
gridResult.refresh();
});