New nested object does not pass propagation to parent

[mitcht]

I am building a knockout SPA. I am trying to create a page validation where if items are ON the page, they get validated and if they are NOT on the page, they don't get validated.

I am trying to figure out an acceptable way to have these items validate this way.

What I am finding is that as soon as I create a new model and add it to my existing model, the knockout-validation does not properly propagate the binding up to the parent view model, making it invalid when the object is created.

When you type in the PARENT box, the main view model is valid, when you click "Add Object" it adds a new object but the parent model is still valid. You can type in the box and it validates, and then the parent validates the entire thing, showing invalid if you remove the typing from either box. This is just weird.

You can see this behavior in the following fiddle: http://jsfiddle.net/3txv0p60/242/

HTML:

VALUE

PARENT OBJECT IS VALID:

(((Parent object should represent the validity of the entire thing)))

Add Object

SUB-VALUE:

SUB-OBJECT ISVALID: js:

User = function () {

var self = this;

// observables
self.firstName = ko.observable();

// validation
self.validationObject = ko.validatedObservable({
    firstName: self.firstName.extend({
        required: true
    })
});

};

IndexViewModel = function () {

var self = this;
// observables
self.users = ko.observable();
self.name = ko.observable();

    self.anotherUser = ko.observable();

// functions
self.addObject = function() {
    if (self.anotherUser() === undefined || self.anotherUser() === null){
      self.anotherUser(new User());
    }     
};

// validation
self.validationObject = ko.validatedObservable({
    anotherUser: self.anotherUser,
    name: self.name.extend({
        required: true
    })