Question

Html form is controlled using Knockout JS and jQuery templates.
Basic jQuery validation is in use to validate fields.
Form gets serialized to JSON and submitted to MVC controller action using AJAX.
MVC controller action performs server-side model validation, adds errors to ModelState.

1. What’s the best practice to return those errors to the client – iterating through errors in ModelState and adding them to key/value collection of errors in the JSON response?

2. How do you display errors on the client? How do you ‘bind’ the key/value collection of errors to relevant fields on the model?

Say there is a “name” field on the model, with a corresponding textbox rendered by the jQuery template. How does one take the error for the “name” field in the collection of errors and display the error message beneath the “name” textbox?

Answer 1

There’s two validation plugins for ko.js (found here) that could help you,

Knock-Knock validation

Knockout Validation

You can wire one of those to the mvc unobstrsive validation data injected client side.