Knockout Add And Edit Observablearray Conflict
I have an observableArray which is displayed in a table using foreach binding where values are displayed inside textboxes. Now what I want to do is to add an edit link on each row
Solution 1:
In the subscribe handler, self.selectedDeduction.subscribe
, you're adding an object to the list of loanDeductions
when you should be adding a new instance of deductionLine
just as you do when you declare self.loanDeductions
.
Or to put it another way, self.loadDeductions
is an observableArray of deductionLine
instances, to which you then add an object with three properties.
Change that subscribe handler to push a new deductionLine(...)
and you'll see the difference.
Solution 2:
I found the cause of the problem, I had to mirror every changes I made with my observableArray to my list.
var deductionLine = function (deductionID, deductionName, amount) {
self = this;
self.deductionID = ko.observable(deductionID);
self.deductionName = ko.observable(deductionName);
self.amount = ko.observable(amount);
self.getreadonlyState = ko.observable('readonly');
self.linkText = ko.computed(function () {
return this.getreadonlyState() == 'readonly' ? "Edit" : "Stop Edit";
}, self);
};
var deductionList = function (deductionID, deductionName, amount) {
self = this;
self.deductionID = ko.observable(deductionID);
self.deductionName = ko.observable(deductionName);
self.amount = ko.observable(amount);
self.getreadonlyState = ko.observable('readonly');
self.linkText = ko.computed(function () {
return this.getreadonlyState() == 'readonly' ? "Edit" : "Stop Edit";
}, self);
};
Here's the fiddle in case anyone bump into a similar issue.
Post a Comment for "Knockout Add And Edit Observablearray Conflict"