user1175857
user1175857

Reputation: 115

How do I add to an existing Knockout JS mapped object?

I have a JSON data from an api that looks like this:

var dataTotalInit = { dataTotal: [{ Cost: 0, Quantity: 0, Security: "" }] };
var mappingResult = ko.mapping.fromJS(dataTotalInit, {}, self);

Later when I get my data from a buttonClick, I want to add to my JSON.

ko.utils.arrayForEach(self.AnotherObject(),function(item) {
     self.dataTotal.push({Cost:item.Cost(),Quantity:item.Quantity(),Security:item.Security()});
});

When I step thru my code, it does add the values to dataTotal but the data isn't observable and so my view doesn't update. Please help thanks

Upvotes: 0

Views: 276

Answers (2)

meze
meze

Reputation: 15087

You need to make all properties of a new object observable too:

ko.utils.arrayForEach(self.AnotherObject(),function(item) {
    self.dataTotal.push(ko.mapping.fromJS({Cost:item.Cost(),Quantity:item.Quantity(),Security:item.Security()}));
});

Upvotes: 1

Alex
Alex

Reputation: 38519

It should be

var dataTotalInit = ko.observableArray();

There's no need to pre-populate the array, but you could do so:

var dataTotalInit = ko.observableArray([[{ Cost: 0, Quantity: 0, Security: "" }]);

Then, as you have in your example, push items into the observableArray:

ko.utils.arrayForEach(self.AnotherObject(),function(item) {
     self.dataTotal.push({Cost:item.Cost(),Quantity:item.Quantity(),Security:item.Security()});
});

More info:
http://knockoutjs.com/documentation/observableArrays.html

Upvotes: 1

Related Questions