Knockout validation error class on input element

Question

I'm fairly new to Knockout and I'm encountering some issues when validating my form.

HTML

<input data-bind="value: naam" type="text" name="naam" id="naam" placeholder="Naam" required />
<input data-bind="value: email" type="email" name="email" id="email" placeholder="E-mail" required pattern="@" />

Knockout

var OrderInfo = function(){
   var self = this;

   self.naam = ko.observable().extend({
       required: "true",
       minLength: 6
   });

   self.email = ko.observable().extend({
       required: "true",
       email: { 
           message: "Gelieve een geldig e-mail adres op te geven.", 
           params: true 
       }
   });
};

Problems

1) When I enter less than 6 chars at "naam", I get the message Please enter at least 6 characters.. Yet the class valid is given to the element. The e-mail input field gets the error class as it should.
2) When I log whether OrderInfo is valid, I always get true, even though I get the error messages;

self.OrderInfo = ko.validatedObservable(self.orderInfo);
console.log("Valid: " + self.OrderInfo.isValid());

I have configured ko.validation like this;

ko.validation.configure({
   errorElementClass: 'error',
   decorateInputElement: true,
   decorateElementOnModified: true,
});

Why is this working for the e-mail field but not the other fields? (I've only posted 1 other field but I got more, same issue for all.) What am I doing wrong?

Which version of the validation plugin are you using (nuget,cdnjs,github)? — nemesv
– nemesv, Commented Aug 26, 2014 at 13:28
As far as I know I'm using the latest version from github.com/ericmbarnard/Knockout-Validation/tree/master/Src — essepikker
– essepikker, Commented Aug 26, 2014 at 13:35
Can you maybe create a repro jsfiddle? Because here it working fine: jsfiddle.net/gqxzt8g9 — nemesv
– nemesv, Commented Aug 26, 2014 at 13:45
The correct version github.com/Knockout-Contrib/Knockout-Validation — Anders
– Anders, Commented Aug 26, 2014 at 16:34
Have a look at this, jsfiddle.net/e3xszun3 If you want to try using ko.validation.group — Shay
– Shay, Commented Aug 28, 2014 at 12:56

essepikker · Accepted Answer · 2014-09-04 08:34:43Z

2

Issue resolved. The problem was in my HTML. When marking up my form I accidently used the same ID twice.

Stupid mistakes take the longest to find... Thanks for trying to help out!

answered Sep 4, 2014 at 8:34

essepikker

1591 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Knockout validation error class on input element

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related