I've been building out a page using ASP.NET MVC 2 using KnockoutJS, KnockoutJS Mapping plugin,, and jQuery 1.7.1. I'd like to be able to also use the KnockoutJS Validation plugin (found here). However I need to have both server and client side validation happening.

Is it possible to have my view models map to the KnockoutJS Validation plugin which uses the .extend() method?

EDIT: Example. Automatically turn this:

[Required]
public string Firstname { get; set; }

Into this:

var viewmodel = {
    firstname: ko.observable().extend({ required: true });
}

I've been building out a page using ASP.NET MVC 2 using KnockoutJS, KnockoutJS Mapping plugin,, and jQuery 1.7.1. I'd like to be able to also use the KnockoutJS Validation plugin (found here). However I need to have both server and client side validation happening.

Is it possible to have my view models map to the KnockoutJS Validation plugin which uses the .extend() method?

EDIT: Example. Automatically turn this:

[Required]
public string Firstname { get; set; }

Into this:

var viewmodel = {
    firstname: ko.observable().extend({ required: true });
}

• javascript
• asp.net-mvc
• validation
• knockout.js

• Are you using Data Annotations on your C# models and using EditorFor to populate clientside validation rules, or would you like to? You can use the same unobtrusive clientside validation that MVC has built in that you might use for standard MVC style forms with not too much work (at least in MVC3 with the Internet Application template). – kendaleiv Commented Feb 17, 2012 at 22:27
• Please see my edits in the original – Ryan Commented Feb 18, 2012 at 3:27
• This is a very intriguing approach and I have given it a lot of thought. I've been thinking about generating behaviour code from C# to Javascript. That said, I think you'll have to create something that reflects the model and generates javascript. Maybe just the validation part and let the mapping plugin do what it does. The combination of the mapping and the generated validation code could give you what you need. The reason why I think you need to generate the validation code is because I think you'll have a hard time generating the validation code using only Javascript, but I may be wrong. – Mikael Östberg Commented Feb 20, 2012 at 10:22
• How are you currently generating the markup in your view? Do you manually add the data-bind="value: someProp"? – madcapnmckay Commented Feb 29, 2012 at 17:34

4 Answers 4

In the Mvc Controls Toolkit I implemented an engine that enables the usual Mvc validation (data annotations or whatever) on knockout.js.Both client side and server side validation can be enabled. Moreover, knockout can be used with Mvc helpers, some bindings are inferred automatically, etc.

If you are using knockoutjs and jquery, I came up with the following very simple method for doing basic client side validation.

Wherever you want to display the error message on your page, include a span tag like this:

<span name="validationError" style="color:Red" 
data-bind="visible: yourValidationFunction(FieldNameToValidate())">
* Required.
</span>

Obviously you need to write "yourValidationFunction" to do whatever you want it to do. It just needs to return true or false, true means display the error.

You can use jquery to prevent a user from proceeding if any validations errors are displayed. You probably already have a save button that triggers a javascript function to do some ajax or whatever, so just include this at the top of it:

 if ($("[name='validationError']:visible").length > 0) {
        alert('Please correct all errors before continuing.');
        return;
    }

This is a lot simpler and more flexible than many other validation solutions out there. You can position your error message wherever you want, and you don't need to learn how to use some validation library, and this method works regardless of server side technology.

I'd recommend using the built in MVC clientside validation, you might need to invoke it, try this:

$.validator.unobtrusive.parse(yourFormElement)

Code from: https://stackoverflow.com/a/5669575/941536

Not sure if MVC2 has unobtrusive clientside validation though, unsure if an upgrade to MVC3 would be an option for you if necessary.

The validation plugin works in the way that you extend the observables you want to validate.

It doesn't matter if they are created from mappings, just create a function that you run after the mappning has been done and add all the validation you want.

Or, if you want you can use the validation bindings. Read the Readme on Github for knockout validation and you see how they do it.