Validating observableArray objects with validatedObservable

[Roarster]

trafficstars

I have a parent object with an observable array that may or may not have objects in it (these can be added by the user) and each of the objects within the array has it's own validation. I'd like to set up the validation on the parent object so that it will be marked as invalid if any of the objects within it's observable array are invalid. To do this I'd like to set up a validatedObservable on each child object with a validatedObservable in the parent that references the observableArray since this seems the common sense approach. However, no matter what I do with the validatedObservables and whatever options I use to configure (deep and live both being true seem like the most likely to work) I still can't get the parent validatedObservable to respond to invalid states within the child objects.

I've set up a simple example at the follow fiddle: http://jsfiddle.net/3txv0p60/9/

I'd expect this to start as valid (since the observable array is empty and so doesn't contain any invalid objects) and to become invalid as soon as a child object is created but I can never get it to become invalid.

I'm not sure if this is a bug, an unsupported feature or just something in the documentation that I'm not understanding but I'd really appreciate it if someone can point me in the right direction to get this working. Previously I've worked around this using a computed observable that checks the state of each entry in the observable array but I'm hopeful there will be a better solution.

[crissdev]

http://jsfiddle.net/su3p1ccv/

Since I'm on my phone I will be very short but try to come up with a longer explanation later on today.

1. When calling ko.validation. init you need to specify the second parameter as true.
2. In order to watch for validatedObservable validation changes (aka keep isValid in sync), observable option must be set to true.
3. Pass the observable array when creating the validatedObservable so that adding new items gets picked by the validation code.

As I said, I will come back later on this issue when I have access to a computer.

[Roarster]

Thanks for the reply @crissdev, I've got it working. Looks like the changes I need to make for my example are only 2 and 3, 1 doesn't seem to be required in my case.

I find it strange that change 2 is the one that makes the difference here, since validation of observables not in the observableArray works fine without it - e.g. http://jsfiddle.net/3txv0p60/11/ - possibly this is just something that isn't clear in the documentation and that the observable parameter does more than change the validation object to an observable.

[Roarster]

Ok, I think I understand this better now. Without observable = true then my nested object's validatedObservables won't be computeds so the top level validatedObservable won't pick up changes to them hence why I'm not seeing updates to my top level isValid.

I'd also expected observable to default to true if I don't define it but I see that will only happen if I don't supply a grouping configuration option at all. It might be nice to change the behaviour of this by having the grouping extend the default rather than an empty object but I think that would probably be a breaking change at this point.

Thanks for your help here, I now understand this a lot better and know how to get it all working now. It might be worth a section in the wiki about this since I don't think any of the examples currently deal with observable arrays and I'd imagine this is a pretty common use case.

[crissdev]

@Roarster Thanks for all your feedback.

Support for grouping options was added in this commit - ie starting with version 2.0.0. Apparently I've overseen the grouping options from configuration when I've added support for that and changing this can cause some (bad) perf side effects, unexpected (UI) behaviour and potentially breaking changes. But this should definitely change with the next major version - extend current grouping options with user provided options.

I agree some docs around this functionality should be added but don't have the necessary time right now. Feel free to contribute to the Wiki if possible and I'll take a look at it - it should speed up the documentation process.

[Roarster]

@crissdev No problem. I've adapted my jsfiddle into a fairly simple page on the wiki. I've used the style I find tends to work best in practice (e.g. validation defined after the observables are defined to prevent issues with undefined fields when validators reference other fields) so feel free to change anything.

[crissdev]

Thanks a lot @Roarster The page looks good. You can add a jsFiddle using the code from the wiki as well. I'll take a closer look these days and add some content too.

[Roarster]

Ok, I've added a link to a working fiddle example. Feel free to update this as well as you see fit.

As far as I'm concerned this issue can be closed now but I'll leave it open in case there's anything else you need it for.

Thanks for your help.