I have a grid of observables and computed observables. The first line contains the interest rates used as a multiplier against the values in all the lines below. The user can edit the interest rate value, and Knockout processes all cascading updates. I also need a separate text box in which the user can enter a new interest rate, which will be applied to each interest rate in the grid.
The initial binding is working fine and the 1 percent rate update is also great.
A javascript warning occurs when a user enters a value in a text box, and I go through the view model, updating each interest rate to match. The grid columns are actually monthly values, so the cycle for updating the interest rate is performed only 12 times.
I tried the throttle expander, but this did not solve the problem. Any ideas?
Update: not sure if this will help, but I added the code
$("#NewRate").change(function (e) {
var newRate = parseFloat($(this).val());
for (var i = 0; i < 12; i++) {
viewModel.resourceCategory.monthAmounts[i].amount(newRate);
}
});
function ConvertToDate(jsonDateString) {
var re = /-?\d+/;
var m = re.exec(jsonDateString);
return new Date(parseInt(m[0]));
}
function MonthAmount(amount, dateKey) {
var self = this;
self.amount = ko.observable(amount).extend({ throttle: 1 });
self.dateKey = ConvertToDate(dateKey);
self.monthIndex = self.dateKey.getMonth();
}
function ResourceCategory(name, monthAmounts) {
var self = this;
self.name = name;
self.monthAmounts = ko.utils.arrayMap(monthAmounts, function (monthAmount) {
return new MonthAmount(monthAmount.Amount, monthAmount.DateKey);
});
self.totalAmount = ko.computed(function () {
var sum = 0;
for (var i = 0; i < self.monthAmounts.length; i++) {
sum += parseFloat(self.monthAmounts[i].amount());
}
return sum.toFixed(2);
}).extend({ throttle: 1 });
self.averageAmount = ko.computed(function () {
return (self.totalAmount() / self.monthAmounts.length).toFixed(2);
}).extend({ throttle: 1 });
}
function ResourceCategoriesMonthTotal(monthIndex, resourceCategories) {
var self = this;
self.monthIndex = monthIndex;
self.dateKey = new Date(new Date().getFullYear(), monthIndex, 1);
self.amount = ko.computed(function () {
var val = 0;
for (var i = 0; i < resourceCategories.length; i++) {
val += parseFloat(resourceCategories[i].monthAmounts[self.monthIndex].amount());
}
return (val).toFixed(2);
}).extend({ throttle: 1 });
}
self.resourceCategoriesMonthTotals = new Array();
for (var monthIndex = 0; monthIndex < 12; monthIndex++) {
self.resourceCategoriesMonthTotals.push(new ResourceCategoriesMonthTotal(monthIndex, self.resourceCategories));
}
self.resourceCategoriesTotal = ko.computed(function () {
var val = 0;
for (var i = 0; i < self.resourceCategoriesMonthTotals.length; i++) {
val += parseFloat(self.resourceCategoriesMonthTotals[i].amount());
}
return (val / self.resourceCategoriesMonthTotals.length).toFixed(2);
}).extend({ throttle: 1 });
Homer source
share