2

I have a viewmodel and there I have properties which are extended to use validation. I call ko.validation.group(self) but this doesn't add the isValid() method to the viewmodel.

So I get an error that isValid() is undefined.

Here is my code:

var brechtbaekelandt = brechtbaekelandt || {};

brechtbaekelandt.login = (function ($, jQuery, ko, undefined) {
"use strict";

function LoginViewModel() {

    var self = this;

    self.userName = ko.observable();
    self.password = ko.observable();
    self.rememberMe = ko.observable();

    self.errorMessage = ko.observable();

    self.userName.extend({ required: { message: 'Please enter your username' } });
    self.password.extend({ required: { message: 'Please enter your password' } });

    self.errors = ko.validation.group(self);
};

LoginViewModel.prototype.login = function () {

    var self = this;      

    self.errorMessage(null);

    alert('entering login');

    // self.isValid() is not a function
    if (!self.isValid()) {

        alert('login invalid');

        self.errors.showAllMessages();
        return;
    }
    else
    {
        alert('login valid');
        // do login
    }       
};

function init() {

    alert('entering init');

    var knockoutValidationSettings = {
        insertMessages: false,
        decorateElement: true,
        decorateElementOnModified: true,
        decorateInputElement: true,
        //errorMessageClass: 'error',
        //errorElementClass: 'error',
        //errorClass: 'error',
        errorsAsTitle: false,
        parseInputAttributes: false,
        messagesOnModified: true,
        messageTemplate: null,
        grouping: { deep: true, observable: true }
    };

    ko.validation.init(knockoutValidationSettings, true);

    var viewModel = new LoginViewModel();

    ko.applyBindingsWithValidation(viewModel);
}

return {
    LoginViewModel: LoginViewModel,
    init: init
};

})($, jQuery, ko);

I have created a js fiddle: click here

I've read somewhere that you need to call registerExtenders() but I tried it and it doesn't work either.

Can someone help me in the right direction? Thx!

  • 1
    something like this http://jsfiddle.net/supercool/hu6rgjjm/7/ . let me know' – super cool Oct 20 '15 at 13:28
  • Yes, I know about this one and I know it works, but in the documentation it says that my method should also work and that ko.validation.group(self) should add the isValid() to self. If there is really no solution to this I will definitly use your example super cool! Thanks! There was someone who had the same issue, but it was resolved using ko.validation.group()... http://stackoverflow.com/questions/16802788/knockout-viewmodel-isvalid-error-when-using-knockout-validation-plugin –  Oct 20 '15 at 13:33
  • `validatedObservable` calls group behind the scenes and stores in errors property and later we call showAllMessages . I never tried with `group` as alternative . Imho you can go with the fiddle version anyhow i'll give a try on what you looking at . cheers – super cool Oct 20 '15 at 16:26
  • Confirmed ! `isValid` doesn't exist when you use `group` you can refer to the same link(2nd one) you pointed out . group will only give you error message information in array (as pointed in earlier comment) . If you insist you want to go with group your use of `error().length` which should work check here http://jsfiddle.net/supercool/hu6rgjjm/10/ . – super cool Oct 20 '15 at 16:45
  • Oh, the errors().length is a nice solution, I'll use this one. Thank you very much! –  Oct 20 '15 at 16:51

1 Answers1

5

well you seem to be looking for isValid when using group tough there is a way (alternate way) using length property to achieve it . As isValid doesn't seem to be available when using group (it exists with validatedObservable) .

As @jeff mentioned in one of this answers on this topic

The ko.validation.group just gives you an (computed) observable of all the error messages in a model. It only collects error messages of direct properties of the model.

The ko.validatedObservable on the other hand not only collects the error messages, but also wraps the model in an observable and adds an isValid property which indicates whether or not there are any error messages (i.e., the model was completely valid). Otherwise, they're essentially the same.

I modified your code accordingly like below

    self.errors = ko.validation.group(self); //It will group error messages in array i.e based on count you must validate 
    LoginViewModel.prototype.login = function () {
            var self = this;      
            self.errorMessage(null);
            //self.isValid() doesn't exist here . so you should base length 
            if (self.errors().length>0) {
                alert('login invalid');         
                self.errors.showAllMessages();
                return;
            }     
        };

working sample with group

working sample with ValidatedObservable Preferable way Imho

super cool
  • 6,003
  • 2
  • 30
  • 63