How do I add to a child observableArray in knockoutjs?

248 Views Asked by At

I am relatively new to knockoutJS and I have mutiple viewModels.

Here is a JS Fiddle that creates campaigns, I want to have a secondary table that list the line items for the campaign that was just added.

http://jsfiddle.net/jmann/rd4pa3xo/

I want to create a campaign that contains multiple lineItems. I want the IO in the lineItem to be the foreign key to the campaign. So I want the field listed in the html to display campaign Name from the newCampaign but I also want to add LineItem fields (ProductType)

Any help is greatly appreciated.

Here is the model I am playing with:

var ViewModels = function () {
var self = this;
self.newLineItem = {
    ID: ko.observable(),
    IO: ko.observable(),
    CampaignID: ko.observable(),
    ProductType: ko.observable()
}
self.newCampaign = {
    ID: ko.observable(),
    IO: ko.observable(),
    Name: ko.observable(),
    LineItems: ko.observableArray()
}

Here is the HTML

<div data-bind="with:newLineItem">
<div class="form-group" data-bind="with:newCampaign">
<input type="text" class="form-control" id="inputCampaignLineItem" data-bind="value:Name" placeholder="Campaign" />
</div>
<div class="form-group">
<input type="text" class="form-control" id="inputProducType" data-bind="value:ProductType" placeholder="ProductType" />
</div>
<button type="submit" class="btn btn-primary pull-right">Add Line Item</button>
0

There are 0 best solutions below