How do I apply knockout validation inside foreach binding

Question

My goal is to apply a knockout required validator on an input that is part of a collection on a viewmodel and made visible inside a foreach binding. Here's what I have so far - errors always evals to 0, not sure where I'm going wrong here.

   var vm = {

    myCollection: myCollection,  <-- im binding the foreach onto this property, and consists of a collection of Items



    submit: function () {
        if (vm.errors().length == 0) {
            alert('Thank you.');   <-- errors is always 0
        } else {
            vm.errors.showAllMessages();
            app.showMessage('There were some errors...', '');
        }
    }
};


 var Item = function (data) {

        self.name = ko.observable().extend({ required: true });

 }

vm["errors"] = ko.validation.group(vm);


<div data-bind="foreach: myCollection">
<input type="text" 
data-bind="value: name,
validationOptions: {errorElementClass: 'input-validation-error' }" />

MikeW · Answer 1 · 2013-06-18T05:30:26.180

0

A rare fix from me..

Added this to the Item model,

    self["itemerrors"] = ko.validation.group(self);

then walked the array in the submit method of the vm

     ko.utils.arrayForEach(vm.mycollection(), function (name) {
          name.itemerrors.showAllMessages();
     });

works a treat

edited Jun 18 '13 at 05:30

answered Jun 18 '13 at 05:23

MikeW

4,749
9
42
83

Or configure the group do be deep and then self.errors.showAllMessages(); on the parent – Anders Jun 18 '13 at 06:52
I'll try that, do you configure deep when you do the applyBinding? – MikeW Jun 19 '13 at 12:53
Its a configure of the validation lib https://github.com/Knockout-Contrib/Knockout-Validation/wiki/Configuration – Anders Jun 19 '13 at 13:16

How do I apply knockout validation inside foreach binding

1 Answers1