knockout validation doesn't add hasError class if exclude validationElement binding

Question

I have added knockout validation to my model.

This works fine:

//init validation
ko.validation.init({
    registerExtenders: true,
    insertMessages: false,
    messagesOnModified: false,
    decorateElement: true,
    errorElementClass: 'hasError'
});

// has required validation for model observable
self.CompanyName= ko.observable(data ? ko.unwrap(data.CompanyName) : '').extend({ required: true });

HTML

//binding
<span class="inline-edit-view" data-bind="text: CompanyName, validationElement: CompanyName"></span>

This adds hasError to the invalid element. If I remove validationElement, though, it doesn't work.

Question is: Why should I use validationElement? It seems counter-intuitive to me.
I already have extend {required: written} for each element and I do not want to write a validationElement binding for each observable.

Answer 1

You need to use the validationElement binding because you are using the text binding.

The Knockout.Validation plugins overrides the value and the checked bindings to apply the different validation aspects like the errorElementClass so if you are using one of this two bindings then you don't need to explicitly use the validationElement binding.

However if you are using different bindings like text then you are responsible to mark your HTML with the validationElement and the validationMessage bindings if you want the validation plugin to use your classes or insert error messages etc.